Reorder dynamic table in html using javascipt
<p>I have a html page where i add rows and delete rows dynamically. Now my goal is to reorder the rows which updated id.</p>

<p>for example i have 3 column in a row in which the 3rd column is given a id based on the rowid. so once i delete a row , i need to reorder this id. is this possible using javascirpt.</p>

<p>sample code is here
    
    </p>

<pre><code>&lt;SCRIPT language="javascript"&gt;
      function addRow(tableID) {

           var table = document.getElementById(tableID);

           var rowCount = table.rows.length;
           var row = table.insertRow(rowCount);

           var cell1 = row.insertCell(0);
           var element1 = document.createElement("input");
           element1.type = "checkbox";
           cell1.appendChild(element1);

           var cell2 = row.insertCell(1);
           cell2.innerHTML = rowCount ;

           var cell3 = row.insertCell(2);
           var element2 = document.createElement("input");
           element2.type = "text";
           element2.id = "batch"+rowCount;
           cell3.appendChild(element2);

      }

      function deleteRow(tableID) {
           try {
           var table = document.getElementById(tableID);
           var rowCount = table.rows.length;

           for(var i=0; i&lt;rowCount; i++) {
                var row = table.rows[i];
                var chkbox = row.cells[0].childNodes[0];
                if(null != chkbox &amp;&amp; true == chkbox.checked) {
                     table.deleteRow(i);
                     rowCount--;
                     i--;
                }

           }
           }catch(e) {
                alert(e);
           }
      }

 &lt;/SCRIPT&gt;
</code></pre>

<p>
</p>

<pre><code> &lt;INPUT type="button" value="Add Row" onclick="addRow('dataTable')" /&gt;

 &lt;INPUT type="button" value="Delete Row" onclick="deleteRow('dataTable')" /&gt;

 &lt;TABLE id="dataTable" width="350px" border="1"&gt;
      &lt;TR&gt;
      &lt;/TR&gt;
 &lt;/TABLE&gt;
</code></pre>

<p>
</p>
