Retrieving from data from added rows in javascript

Good morning, I have a question related to forms and selects when using javascript. I have a requirement to allow the user to click a button on a web page to add additional rows of information on a web page. every time they click a button, it adds a new row with four text boxes and one drop down box to the web page for data entry. Works fine with text boxes, but Ive added a drop down box to the rows and cant figure out how to grab that drop down select for inserting into a database. I need to grab data from any rows added to insert into a table in SQL Server

My script is:

<script language="javascript">
    row_no=1;
    function addRow(tbl,row){
        //so that user can only add 8 rows
        if(row_no<=7){    
        var textbox='<input type="text" name="textfield[]">';//for text box
        var remove= '<a href="#" onclick="removeRow(\''+ tbl +'\',\'' + row_no + '\')"/></a><br>';
   
      //for the text which is used to remove the current row by using the function removeRow(..,..)
       
        //for suitable label to the row
        if(row_no==1) {
      textbox='<input type="text" name="txtfield1" size="10">&nbsp;&nbsp;<input type="text" name="txtfield1a" size="10">&nbsp;&nbsp;<input type="text" name="txtfield1b" size="10" class="style2color13addblock"><input type="text" name="txtfield1C" size="10" class="style2color13addblock">';
        text="<div class='label' align=left></div>";
      }
      else if(row_no==2) {
      textbox='<input type="text" name="txtfield2" size="10">&nbsp;&nbsp;<input type="text" name="txtfield2a" size="50">&nbsp;&nbsp;<input type="text" name="txtfield2b" size="10" class="style2color13addblock">';
      text="<div class='label' align=right></div>";
       }
        else if(row_no==3) {
      textbox='<input type="text" name="txtfield3" size="10">&nbsp;&nbsp;<input type="text" name="txtfield3a" size="50">&nbsp;&nbsp;<input type="text" name="txtfield3b" size="10" class="style2color13addblock">';
      text="<div class='label' align=right></div>";
      }
     
     
      else if(row_no==4) {
      textbox='<input type="text" name="txtfield4" size="10">&nbsp;&nbsp;<input type="text" name="txtfield4a" size="50">&nbsp;&nbsp;<input type="text" name="txtfield4b" size="10" class="style2color13addblock">';
      text="<div class='label' align=right></div>";
      }  
         
      else if(row_no==5) {
      textbox='<input type="text" name="txtfield5" size="10">&nbsp;&nbsp;<input type="text" name="txtfield5a" size="50">&nbsp;&nbsp;<input type="text" name="txtfield5b" size="10" class="style2color13addblock">';
      text="<div class='label' align=right></div>";
      }
         
      else if(row_no==6) {
      textbox='<input type="text" name="txtfield6" size="10">&nbsp;&nbsp;<input type="text" name="txtfield6a" size="50">&nbsp;&nbsp;<input type="text" name="txtfield6b" size="10" class="style2color13addblock">';
      text="<div class='label' align=right></div>";
      }
      else if(row_no==7) {
      textbox='<input type="text" name="txtfield7" size="10">&nbsp;&nbsp;<input type="text" name="txtfield7a" size="50">&nbsp;&nbsp;<input type="text" name="txtfield7b" size="10" class="style2color13addblock">';
      text="<div class='label' align=right></div>";
      }
var tbl = document.getElementById(tbl);//to identify the table in which the row will get insert
        var rowIndex = document.getElementById(row).value;//to identify the row after which the row will be inserted
        try {
            var newRow = tbl.insertRow(row_no);//creation of new row
            var newCell1 = newRow.insertCell(0);//first  cell in the row
            newCell1.innerHTML = text;//insertion of the 'text' variable in first cell
         
         var newCell2 = newRow.insertCell(1);//first  cell in the row
            newCell2.innerHTML = text;//insertion of the 'text' variable in first cell
         
         var newCell3 = newRow.insertCell(2);//first  cell in the row
            newCell3.innerHTML = text;//insertion of the 'text' variable in first cell
         
    var cell4 = newRow.insertCell(3);
    var element4 = document.createElement("select");
    var option1 = document.createElement("option");
    option1.innerHTML = "Option1";
    option1.value = "1";
    element4.add(option1, null);
    var option2 = document.createElement("option");
    option2.innerHTML = "Option2";
    option2.value = "2";
    element4.add(option2, null);
    cell4.appendChild(element4);
         
    var newCell = newRow.insertCell(1);//second cell in the row
            newCell.innerHTML = textbox + " " + remove;//insertion of the text box and the remove text using their variable
            row_no++;
        } catch (ex) {
            alert(ex); //if exception occurs
        }  
    }
    if(row_no>7)//if the row contain 3 textbox, the add button will disapper
    {
        document.getElementById("add").style.display="none";
    }                        
}
function removeRow(tbl,num)
{
    var table = document.getElementById(tbl);//adentification of table
    try {
        row_no--;
        table.deleteRow(num);//deletion of the clicked row
    } catch (ex) {
        alert(ex);
    }
    if(row_no<=7)//if row is less than 8 then the button will again appear to add row
    {
            document.getElementById("add").style.display="block";
    }    
} </script>

And my HTML is:

<form id="Form_RequestAccess" name="Form_RequestAccess" method="post" action="InsertForm.cfm">


<table width="900" cellspacing="2" cellpadding="1" id="mytable">

   
    <tr id="myrow"><td></td><td></td><td></td><td></td><td></td>
    </tr>
   
    <tr ID="add" height="20">
      <td width="6"></td><td align="left"><input type="button" name="Button" value="Add IT Item" onClick="addRow('mytable','myrow')"></td>
    </tr>
  </table>  

<table width="900">
   <col style="width:22px">  
   <tr>
   <td></td>
   <td><input name="submit" type="submit" value="Save Draft">
      <input name="reset" type="reset" style="margin-right: 166" value="Discard Changes"></td></tr></table>  
</form>