title: jquery load event never triggered
body: <p>I am attempting to understand the 'load' event in jQuery as described here: <a href="http://api.jquery.com/load-event/" rel="nofollow">http://api.jquery.com/load-event/</a>.  So far, I have been unable to get it triggered even once!</p>
  
  <p>Here is some sample code.  The only console message that turns up is "DOM READY"  -not a single load call.  Replacing calls to .load() with .bind('load',..)  does not make any difference.</p>
  
  <pre><code>   &lt;!DOCTYPE html&gt;
     &lt;html&gt;
     &lt;head&gt;
            &lt;script src="lib/jquery.min.js"&gt;&lt;/script&gt;
            &lt;script&gt;
             $(function(){
                console.log("DOM READY");
             });
             $(document).load(function(){
                console.log("Document Loaded");
             });
             $('#foo').load(function(){
                console.log("foo loaded");
             });
             $('#bar img').load(function(){
                console.log('image loaded');
             });
             $('#bar').load(function(){
                console.log('bar loaded');
             });
             &lt;/script&gt;
     &lt;/head&gt;
     &lt;body&gt;
       &lt;div id="foo"&gt;Hellow world&lt;/div&gt;
       &lt;div id="bar"&gt;
          &lt;img src="pics/pig.png"/&gt;
       &lt;/div&gt;
     &lt;/body&gt;
     &lt;/html&gt;
  </code></pre>
  
  <p>What am I doing wrong?</p>