title: Dynamically add input type select with options in Javascript
body: <p>I have found adding inputs to a form is quite simple in Javascript, but for some reason adding the select input with options is not working. The options are appearing outside of the dropdown. </p>
  
  <p>Here's my code in jsfiddle: <a href="http://jsfiddle.net/LNVTQ/" rel="noreferrer">http://jsfiddle.net/LNVTQ/</a></p>
  
  <p>Here's my code inline:</p>
  
  <pre><code>var choices=[];
  choices[0]="one";
  choices[1]="two";
  
  function addInput(divName){
      var newDiv=document.createElement('div');
      newDiv.innerHTML="&lt;select&gt;";
      for(i=0; i&lt;choices.length; i=i+1){
          newDiv.innerHTML=newDiv.innerHTML+"&lt;option value='"+choices[i]+"'&gt;"+choices[i]+"&lt;/option&gt;";
      }
      newDiv.innerHTML=newDiv.innerHTML+"&lt;/select&gt;";
      document.getElementById(divName).appendChild(newDiv);
  }
  </code></pre>
  
  <p>And the HTML:</p>
  
  <pre><code>&lt;form class="new" method="post" action="/jobs"&gt;
      &lt;div id="dynamicInput"&gt;&lt;/div&gt;
      &lt;input type="button" value="Add" onclick="addInput('dynamicInput');" /&gt;
      &lt;input type="button" value="Save" /&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>I will accept answers using jQuery or just vanilla Javascript.</p>