title: creating input field for html form... but adding a 'label' for it as well?
body: <p>I have an html form. When you click the button, a javascript function adds a new field. I'm trying to have the function also add a 'label' for the field as well. </p>
  
  <p>I've tried using document.createElement("LABEL"), but that doesn't let me change the innerHtml (or maybe I'm doing it wrong..), nor add a closing </p>
  
  <p>Here is my code. Thanks!
      
      
          
              var instance = 2;</p>
  
  <pre><code>        function newTextBox(element)
          {       
              instance++; 
              // Create new input field
              var newInput = document.createElement("INPUT");
              newInput.id = "text" + instance;
              newInput.name = "text" + instance;
              newInput.type = "text";
              instance++; 
  
              document.body.insertBefore(document.createElement("BR"), element);
              document.body.insertBefore(newInput, element);
  
          }
      &lt;/script&gt;
  &lt;/head&gt;
  
  
  &lt;body&gt;
      &lt;LABEL for="text1"&gt;First name: &lt;/LABEL&gt;
      &lt;input id="text1" type="text" name="text1"&gt;
      &lt;LABEL for="text2"&gt;Last name: &lt;/LABEL&gt;
      &lt;input id="text2" type="text" name="text2"&gt;
  
  
  
      &lt;input type="button" id="btnAdd" value="New text box" onclick="newTextBox(this);" /&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p></p>