title: How do I hide an element on a click event anywhere outside of the element?
body: <p>I would like to know whether this is the correct way of hiding visible elements when clicked anywhere on the page. </p>
  
  <pre><code>$(document).click(function (event) {            
      $('#myDIV:visible').hide();
  });
  </code></pre>
  
  <p>The element (div, span, etc.) shouldn't disappear when a click event occurs within the boundaries of the element.</p>