title: Uncaught ReferenceError: $ is not defined when using $(document).ready
body: <p>I'm using the Foundation CSS framework, which loads jQuery in the footer. This is not atypical and recommended practice by many. However, I need to write scripts in the page. Using document ready should do the trick, but I'm still getting an error. Why?</p>
  
  <pre><code>$(document).ready(function(){
      // My Code
      var a;
      $(#id).dosomething({
      // Doing Something
      });
  });
  </code></pre>
  
  <p>Just before body close tag:</p>
  
  <pre><code>&lt;script src="scripts/jquery-1.8.0.min.js"&gt;&lt;/script&gt;
  // More Scripts
  &lt;/body&gt;
  </code></pre>
  
  <p>But I get the standard error "Uncaught ReferenceError: $ is not defined" (4x because I have 4 scripts in the body). Also, I cannot move the jQuery reference above the script call as it conflicts with other scripts. I cannot move the script call below jQuery reference either.</p>