Collect Inline Javascript Into A Single Script
<p>New to jQuery. Mostly loving it, but having some real trouble compiling all my on-page commands into a single .js document.</p>

<ul>
<li>The site: <a href="http://wlvrtn.com/sites/nms-site2/" rel="nofollow">http://wlvrtn.com/sites/nms-site2/</a></li>
<li>Functions.js, where I want all custom js commands to live: 
<a href="http://wlvrtn.com/sites/nms-site2/_/js/functions.js" rel="nofollow">http://wlvrtn.com/sites/nms-site2/_/js/functions.js</a></li>
</ul>

<p>When I try to move any of the following commands from the page head into functions.js, they at best stop working, and at worst interfere with other functions as well.</p>

<p>How can I clean this up?</p>

<pre><code>&lt;!-- leanModal --&gt;
&lt;script type="text/javascript" src="_/js/jquery.leanModal.min.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;
        $(function() {
            $('a[rel*=leanModal]').leanModal({ top : 70, closeButton: ".modal_close" });    

        });
&lt;/script&gt;

&lt;!-- sticky --&gt;
&lt;script src="_/js/jquery.sticky.min.js"&gt;&lt;/script&gt;
&lt;script&gt;
        $(window).load(function(){
            $("#chapters").sticky({ topSpacing: 54 });
        });
&lt;/script&gt;

&lt;!-- customSelect --&gt;
&lt;script type="text/javascript" src="_/js/jquery.customSelect.min.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;
    $(function(){
        $('#risk select').customSelect();
    });
&lt;/script&gt;

&lt;!-- happy.js --&gt;
&lt;script src="_/js/happy.js"&gt;&lt;/script&gt;
&lt;script src="_/js/happy.methods.js"&gt;&lt;/script&gt;
&lt;script&gt;
  $(document).ready(function () {
    $('#consultation, #risk').isHappy({
      fields: {
        '#consultation-name': {
          required: true,
          message: 'Please share your name'
        }, 
        '#risk-email': {
          required: true,
          message: 'Please share your email'
        } 
      }
    });
  }); 
&lt;/script&gt;
</code></pre>
