jQuery on click on everything but a div and it's children

Question

I want to do something when I click anywhere, except when I click a div and it's children. This is what I've tried so far, but it's not working (clicking on it's children still executes what is within the brackets.

$('body').on('click', '* :not(#calculator)',  function(e){

I cannot use something like this:

jQuery - Select everything except a single elements and its children?

$("body > *").not("body > #elementtokeep").remove();

Because the .not function is not something I can put inside the .on() function.

How can I achieve this?

Answer 1

Use not with a comma to have both selectors: the element itself and the elements children

jQuery(document.body).on("click", ":not(#calculator, #calculator *)", function(e){ 
    console.log(this); 
    e.stopPropagation(); 
});​​​​​​​

jsFiddle