click on body except on specific div

The selector $("body").not($("#menutop")) will select the body element if it is not the #menutop element. Since the body element clearly isn't #menutop element, the body element is still selected and the click event is attached to it.

Even if you click on the #menutop element, the click event will still bubble up and trigger the click event on the body element, therefore one option is to make a check to see if event.target is the #menutop element:

$(document).on('click', function (event) {
  if (!$(event.target).closest('#menutop').length) {
    // ... clicked on the 'body', but not inside of #menutop
  }
});

Alternatively, you could also suppress the event bubbling and stop event propagation when clicking in the #menutop element:

$(document).on('click', function (event) {
  // ... clicked on the 'body', but not inside of #menutop
});
$('#menutop').on('click', function (event) {
  event.stopPropagation();
});

You can use event.stopPropagation() on the menutop element to prevent click through to the body below.

See this codepen for the solution

JS

$("body").click(function(){
    alert("323");
});

$("#menutop").click(function(event) {
    event.stopPropagation();
});

Tags:

Jquery