Document click not in elements jQuery

Question

Using jQuery how does one detect clicks not on specific elements, and perform an action consequently?

I have the following JavaScript

$('#master').click(function() {     $('#slave').toggle(); });  $(document).not('#master','#slave').click(function() {     $('#slave').hide(); }); 

and I cannot see where I am going wrong logically. You can see a live example here

Answer 1

Since you're binding to the click event on the document, you can use event.target to get the element that initiated the event:

$(document).click(function(event) {     if (!$(event.target).is("#master, #slave")) {         $("#slave").hide();     } }); 

EDIT: As Mattias rightfully points out in his comment, the code above will fail to identify click events coming from descendants of #master and #slave (if there are any). In this situation, you can use closest() to check the event's target:

$(document).click(function(event) {     if (!$(event.target).closest("#master, #slave").length) {         $("#slave").hide();     } });