title: Jquery does not work if I place it just before </body>, but works if i put it in <head>
body: <p>I am trying hard for 2 days for this jquery to work in my HTML page. Finally It worked when I put script tags below head. Is it normal?</p>
  
  <p>I tried everything:
  -linking script from ajax google apis.
  -linking it from maven dependency.
  -linking it from folder.</p>
  
  <p><strong>this does not work:</strong></p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;title&gt;Home&lt;/title&gt;
  
  &lt;/head&gt;
  &lt;body&gt;      
  
      &lt;a href="#" id="button"&gt;click me&lt;/a&gt;
  
      &lt;div id="show_hide" style="display: none;"&gt;
          hey
      &lt;/div&gt; 
  
      &lt;script  type="text/javascript"&gt;
      $(document).ready(function(){
  
              $('#button').click(function() {
                  $('#show_hide').show();
  
              });     
      });
      &lt;/script&gt;
  
      &lt;script src="webjars/jquery/1.9.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>and this works:</strong></p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;title&gt;Home&lt;/title&gt;
  &lt;script src="webjars/jquery/1.9.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;      
  
      &lt;a href="#" id="button"&gt;click me&lt;/a&gt;
  
      &lt;div id="show_hide" style="display: none;"&gt;
          hey
      &lt;/div&gt; 
  
      &lt;script  type="text/javascript"&gt;
      $(document).ready(function(){
  
              $('#button').click(function() {
                  $('#show_hide').show();
  
              });     
      });
      &lt;/script&gt;
  
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>