jquery load event never triggered
<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>
