title: Copy dropdown values on dynamic textbox
body: <p>I've got dynamic textboxes which are added upon button click. </p>
  
  <p>However, I wanted to copy the dropdown values on each dynamic copied dynamic textbox for some other purposes. </p>
  
  <p>But, it only copies the value of the dropdown on the first textbox and is not copying on all respective textboxes. Please help.</p>
  
  <p>My code:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>function addRow() {
    var table = document.getElementById("bod");
    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);
    var but = document.getElementById("submit_form");
  
    row.insertCell(0).innerHTML = test_type.value;
    row.insertCell(1).innerHTML = '&lt;input type="text" name="question[]" id="question" size="20"/&gt;';
    row.insertCell(2).innerHTML = '&lt;input type="button" value="Delete" onClick="Javacsript:deleteRow(this)"/&gt;';
    row.insertCell(3).innerHTML = '&lt;input type="text" name="test_type_val[]" id="test_type_val"/&gt;';
  
  }
  
  function copyValue() {
    var dropboxvalue = document.getElementById('test_type').value;
    document.getElementById('test_type_val').value = dropboxvalue;
  }
  
  function deleteRow(obj) {
  
    var index = obj.parentNode.parentNode.rowIndex;
    var table = document.getElementById("bod");
    table.deleteRow(index);
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;select id="test_type" name="test_type" /&gt;
  &lt;option value=""&gt;&lt;/option&gt;
  &lt;option value="EASY"&gt; EASY &lt;/option&gt;
  &lt;option value="MEDIUM"&gt; MEDIUM &lt;/option&gt;
  &lt;option value="DIFFICULT"&gt; DIFFICULT &lt;/option&gt;
  &lt;/select&gt;
  &lt;input type="button" id="add" name="add" value="Add" onclick="Javascript:addRow(); copyValue()"&gt;
  &lt;/div&gt;
  
  &lt;br&gt;
  &lt;table id="bod"&gt;
    &lt;tr&gt;
      &lt;th&gt;TEST TYPE&lt;/th&gt;
      &lt;th&gt;QUESTION&lt;/th&gt;
      &lt;th&gt;DELETE BUTTON&lt;/th&gt;
      &lt;th&gt;COPIED VALUE FROM DROPDOWN&lt;/th&gt;
    &lt;/tr&gt;
  &lt;/table&gt;</code></pre>
  </div>
  </div>
  </p>