title: jQuery append() and remove() element
body: <p>I have a form where I'm dynamically adding the ability to upload files with the append function but I would also like to be able to remove unused fields. Here is the html markup</p>
  
  <pre><code>&lt;span class="inputname"&gt;Project Images:
      &lt;a href="#" class="add_project_file"&gt;&lt;img src="images/add_small.gif" border="0"&gt;&lt;/a&gt;
  &lt;/span&gt;
  &lt;span class="project_images"&gt;
      &lt;input name="upload_project_images[]" type="file" /&gt;&lt;br/&gt;
  &lt;/span&gt;
  </code></pre>
  
  <p>Right now if they click on the "add" gif a new row is added with this jquery</p>
  
  <pre><code>$('a.add_project_file').click(function() {
      $(".project_images").append('&lt;input name="upload_project_images[]" type="file" class="new_project_image" /&gt; &lt;a href="#" class="remove_project_file" border="2"&gt;&lt;img src="images/delete.gif"&gt;&lt;/a&gt;&lt;br/&gt;');
      return false;
  });
  </code></pre>
  
  <p>To remove the input box i've tried to add the class "remove_project_file" then add this function. </p>
  
  <pre><code>$('a.remove_project_file').click(function() {
      $('.project_images').remove();
      return false;
  });
  </code></pre>
  
  <p>I think there should be a much easier way to do this. Maybe i need to use the $(this) function for the remove. Another possible solution would be to expand the "add project file" to do both adding and removing fields. </p>
  
  <p>Any of you JQuery wizards have any ideas that would be great</p>