title: jQuery blur handler not working on div element?
body: <p>I don't understand why the jQuery blur handler isn't working in the most simple case. I'm literally creating a div 100px by 100px and setting a blur event on it, but it's not firing (<a href="http://jsfiddle.net/FhLn8/" rel="nofollow">JSFiddle</a>):</p>
  
  <pre><code>&lt;div id="test"&gt;this is a test&lt;/div&gt;
  </code></pre>
  
  
  
  <pre><code>$(document).ready(function() {
      $('#test').bind('blur', function() {
            alert('blur event!'); 
      });
  });
  </code></pre>
  
  <p>Is my understanding of blur wrong? I expect the blur event to fire when I click anywhere that is not the div...right?</p>
  
  <p>According to jQuery's documentation:</p>
  
  <blockquote>
    <p>In recent browsers, the domain of the event has been extended to
    include <strong><em>all element types</em></strong>. An element can lose focus via keyboard
    commands, such as the Tab key, <strong><em>or by mouse clicks elsewhere on the
    page.</em></strong></p>
  </blockquote>
  
  <p>I've tried it on the latest Chrome and Firefox on Mac.</p>