JSFiddle - React, Tailwind, and code Playground

by Steve Monro

HTML

<body>
    <table id="myTable">
        <tr><td>test #1</td><td><a href="#">Here we go1!</a></td></tr>
        <tr><td>test #2</td><td><a href="#">Here we go2!</a></td></tr>
        <tr><td>test #3</td><td><a href="#">Here we go3!</a></td></tr>        
        <tr><td>test #4</td><td><a href="#">Here we go4!</a></td></tr>        
        <tr><td>test #5</td><td><a href="#">Here we go5!</a></td></tr>
    </table>
</body>

JavaScript

var table = document.getElementById("myTable");
var row = table.insertRow(1);    //inserts row at index 1, like in your example
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
cell1.innerHTML = "data1";
cell2.innerHTML = "data2";

// This line becomes the 4th line after the insert.
// But it has the row value of 3, because row 1 is 0
// <tr><td>test #3</td><td><a href="#">Here we go3!</a></td></tr>   

var row = table.deleteRow(3);    //inserts row at index 1, like in your example