title: Combining jQuery plugin files generates errors
body: <p>I am combining plugin files to reduce the number of HTTP requests. Removed minimization for debugging.</p>
  
  <p>The combined script file is:</p>
  
  <p>test.js:</p>
  
  <pre><code>(function($){
      $.fn.extend({
      GetNewDiv: function(){
          return $('&lt;div&gt;Testing new div&lt;/div');
      }
      });
  })(jQuery)
  
  // ;jQuery.noConflict(); 
  (function($){
      $.fn.extend({
      GetNewSpan: function(){
          return $('&lt;span class="test"&gt;Testing new div&lt;/span&gt;');
      }
      });
  })(jQuery)
  </code></pre>
  
  <h2>HTML that uses this file</h2>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;script type="text/javascript" src="jquery-1.4.2.js"&gt;&lt;/script&gt;
  &lt;script src="test.js" type="text/javascript"&gt;&lt;/script&gt;
  
  &lt;script type="text/javascript"&gt;
  
  $(document).ready(function(){
      alert('document ready');
  });
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  test message
  &lt;/body&gt;
  </code></pre>
  
  <h2>    </h2>
  
  <p>Opening the file in Firefox displays this error in Firebug</p>
  
  <pre><code>function ($) {$.fn.extend({GetNewDiv: function () {return $("&lt;div&gt;Testing new div&lt;/div");}});}(jQuery) is not a function
  file:///C://js/test.js
  Line 10
  </code></pre>
  
  <p>Adding "jQuery.noConflict(); " between the 2 plugin helps, but then the error changes to 
  $ is not a function</p>
  
  <p>Any ideas what is wrong? What is the correct way to combine multiple .js files into one file? </p>
  
  <p>Thanks
  Abhi</p>