JSFiddle - React, Tailwind, and code Playground

HTML

<p>
    <button type="button" onclick="addRow()">Add Row</button>
</p>
<table>
    <tbody id="body">
    </tbody>
</table>

CSS

table {
    background-color: #999999;
}
tr {
    background-color: #DDDDDD;
}

JavaScript

var i = 1;

function addRow() {		
    document.getElementById('body').innerHTML += '' +
        '<tr id="row' + i + '">' +
        '<td>' + i + 'A</td>' +
        '<td>' + i + 'B</td>' +
        '<td><button type="button" onclick="togglePosition(' + i + ')">Toggle position:absolute</button></td>' +
        '<td><button type="button" onclick="removeRow(' + i + ')">Remove Row</button></td>' +
        '</tr>';
    i++;
}

function removeRow(index) {
    var row = document.getElementById('row' + index);
    row.parentNode.removeChild(row);
}

function togglePosition(index) {
    var row = document.getElementById('row' + index);
    if (row.style.position === 'absolute') {
        row.style.position = null;
        row.style.backgroundColor = null;
    } else {
        row.style.position = 'absolute';
        row.style.backgroundColor = 'rgba(255, 0, 0, 0.5)';
    }
}

addRow();
addRow();
addRow();