title: $('body').on('click') not working
body: <p>So I want to trigger an action after a click anywhere on the body, the code is: </p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;body&gt;
     &lt;div class="paper"&gt;&lt;/div&gt; 
  &lt;/body&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>body{
      background-color: #F5F5F5;
      margin:0px;
      padding:0px;}
  .paper{
      width: 500px;
      height: 200px;
      box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
      background-color: white;}
  </code></pre>
  
  <p>and js: </p>
  
  <pre><code>window.onload = function(){
             $('body').on('click',function(){
                 console.log("click");
             })
         }
  </code></pre>
  
  <p>My problem is that the click is only registered when I click in our next to the div; if I click below nothing happens. </p>
  
  <p>I am a bit confused by this, isn't the body the entire page? If I change the background-color of the body the entire background in the browser gets that colour, but using it with jQuery is different? </p>
  
  <p>(jQuery is properly loaded and there are no error logs)</p>