title: Javascript script loading order - function undefined
body: <p>I am working within a not so nice template which has forced me to load some scripts in with JS as I can not control there order. I am trying to load a library but when I attempt to call it, I get an undefined error.</p>
  
  <pre><code>$.getScript( "js/velocity.min.js").done(function(){
      $('body').velocity({ width: 200})
  });
  </code></pre>
  
  <p>Get error: Uncaught TypeError: $(...).velocity is not a function</p>
  
  <p>How can this be? I just loaded you!</p>
  
  <p><img src="https://i.stack.imgur.com/qYU4d.png" alt="enter image description here"></p>
  
  <p>Ok there was a conflict with another script which has to be loaded, to fix this I wrapper the velocity code in a closure and set 'define' to null within it.</p>
  
  <pre><code>(function($){
      var define = null;
      //then velocity code is here
  })(jQuery)
  </code></pre>