title: Help with appendTo() jquery function on form
body: <p>I am a beginner, so keep that in mind.</p>
  
  <p>so what I currently have working is my form successfully adds another input to the form, however it appears out of the form div. Basically I want it to appear within the div and above the submit button.</p>
  
  <p>how do I do this?</p>
  
  <p>here is main appendTo in my javascript:</p>
  
  <pre><code>var i = $('input').size() + 1; 
  $('a#add').click(function() { 
      $('&lt;input type="text" value="user' + i + '" /&gt;').appendTo('form'); 
      i++; 
  });
  </code></pre>
  
  <p>here is the form html as on request.</p>
  
  <pre><code>&lt;div id="stylized" class="myform"&gt;
  &lt;form name="addstudents" method="post" action="add_students.php"&gt;
  &lt;div id="formHeader"&gt;
      &lt;h1&gt;Add student(s)&lt;/h1&gt;
      &lt;p&gt;Please enter student's HEMIS number&lt;/p&gt;
  &lt;/div&gt;
  &lt;label&gt;Student: &lt;span class="small"&gt;Enter HEMIS number&lt;/span&gt; &lt;/label&gt;
  &lt;input type='text' name="user_1"&gt;
  &lt;input type="submit" class="Mybutton" id="mybutton" name="submit" value='Submit Student(s)'&gt;
  &lt;div class="spacer"&gt;&lt;/div&gt;
  &lt;/form&gt;
  &lt;a href="#" id="add"&gt;Add&lt;/a&gt;&lt;a href="#" id="remove"&gt;Remove&lt;/a&gt;&lt;/div&gt;
  </code></pre>
  
  <p>Any help would be greatly appreciated.</p>
  
  <p>thanks</p>
  
  <p>NEW PROBLEM: REMOVING!</p>
  
  <p>here is my current remove JS, it simply removes the submit button first :(</p>
  
  <pre><code>$('a#remove').click(function() { 
  if(i &gt; 3) { 
      $('input:last').remove(); 
      i--; 
  }
  });
  $('a.reset').click(function() {
  while(i &gt; 2) { 
      $('input:last').remove(); 
      i--;
  }
  });
  </code></pre>
  
  <p>Thanks again</p>