title: Delay a function until $ becomes available
body: <p>Yahoo suggests to <a href="http://developer.yahoo.com/performance/rules.html#js_bottom" rel="nofollow">load scripts at the bottom of an HTML pages</a> for performance reasons. I use HTML5 Boilerplate, which honour the rule.</p>
  
  <p>The problem with this approach is that jQuery is loaded at the bottom, too. If for some reason I need to write inline javascript containing jQuery code I can't, because <code>$</code> is not yet available in the namespace.</p>
  
  <p>This happens for example with galleria.js (jQuery image gallery engine), which requires this markup:</p>
  
  <pre><code>&lt;div id="gallery"&gt;
      &lt;img src="/media/img1.png" /&gt;
      &lt;img src="/media/img2.png" /&gt;
  &lt;/div&gt;
  
  &lt;script&gt;
  $('#gallery').css('height', '200px'); // this is required for galleria to work
  Galleria.run('#gallery');
  &lt;/script&gt;
  </code></pre>
  
  <p>The code to set the height of <code>#gallery</code> doesn't work because jQuery gets loaded later. Firebug console gives:</p>
  
  <pre><code>ReferenceError: $ is not defined
  </code></pre>
  
  <p>Any hint to posticipate the execution of <code>&lt;script&gt;</code> block until the <code>$</code> symbol can be found in the namespace?</p>