title: DIV losing focus when clicking on elements inside it
body: <p>Why does the DIV lose focus when i click on elements inside it?
  I have an JS that hides the DIV when it loses focus. But that should not happen when clicking on elements inside the DIV.
  It needs to be done with .on because there is some ajax loading going on.</p>
  
  <pre><code>$(document).on('focusout', '#geomodal', function(e) {
      console.log('.focusout');
  });
  </code></pre>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div id="geomodal" tabindex="-1"&gt;
      &lt;input value="109" name="districts[]" type="checkbox"&gt;
      &lt;label&gt;Bla&lt;/label&gt;
      &lt;br&gt;
      &lt;input value="152673" name="districts[]" type="checkbox"&gt;
      &lt;label&gt;Blabla&lt;/label&gt;
      &lt;br&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><a href="http://jsfiddle.net/2g41su81/2/" rel="nofollow">http://jsfiddle.net/2g41su81/2/</a></p>
  
  <p>jQuery Documentation:</p>
  
  <blockquote>
    <p>The focusout event is sent to an element when it, or any element
    inside of it,  loses focus.</p>
  </blockquote>