title: Appending a new file upload button when the previous changes
body: <p>I have a function that uses jQuery to add in an additional file upload button when a user adds a file. My problem is that I cannot seem to have it either add in proper format or add every time. My current function simply tries added the string directly:</p>
  
  <pre><code>jQuery(document).ready(function($) {
      $(function() {
          $("input:file").change(function(){
              $("input:file").after("&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td class=\"field_name span4\"&gt;&lt;strong&gt;&lt;/strong&gt;&lt;/td&gt;&lt;td class=\"field_option\"&gt;&lt;input type=\"file\" name=\"pictures\"&gt;");
          });
      });
  });
  </code></pre>
  
  <p>You can see a live version of this here: <a href="http://1ro.co/salem/?module=insert" rel="nofollow">http://1ro.co/salem/?module=insert</a></p>
  
  <p>The issue with the method shown above is it does not add the first two closing tags: <code>&lt;/td&gt;&lt;/tr&gt;</code>.</p>
  
  <p>I've tried methods such as setting $("input:file"); to a variable, however that doesn't set for every value after the first. For example:</p>
  
  <pre><code>var count = 0;
  
  jQuery(document).ready(function($) {
      $(function() {
          var input = $("input:file");
          input.change(function(){
              input.after(input.get(count++));
          });
      });
  });
  </code></pre>
  
  <p>However this doesn't append at all (in theory would probably append every element), and I cannot use .after() on input.get(count).</p>
  
  <p>In simple terms, I'm looking to improve this and make it so it will append the a new file upload button, and not being formatted improperly. If possible, I would rather use method 2 but at the moment I would like for it to just work.</p>