JSFiddle - React, Tailwind, and code Playground

HTML

<table id="dataTable" style="width: 300px;" border="0">
            <tr>
                <td ><input type="checkbox" name="chk"  /></td>

                <td><input id="txt" type="text" onkeypress="expandTextBox(this);"/> </td>
            </tr>
        </table>

JavaScript

expandTextBox = function (tb) {
    tb.style.width = ((tb.value.length + 1) * 8) + 'px';
}

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";
        element1.name = "chkbox[]";
        cell1.appendChild(element1);

        var cell2 = row.insertCell(1);          
        var element2 = document.createElement("input");
        element2.onkeypress = function() {expandTextBox(element2);};
        element2.type = "text";
        element2.name = "txtbox[]";
        cell2.appendChild(element2);


    }

addRow('dataTable');