JSFiddle - React, Tailwind, and code Playground

HTML

<table class="dynatable">
        <thead>
            <tr class="Header">
                <th id="AddRowTh"><button class="add">Add Row</button></th>
                <th>ID &nbsp;&nbsp;<a href="#" class="RemoveColumn">Remove</a></th>
                <th>Name&nbsp;&nbsp;<a href="#" class="RemoveColumn">Remove</a></th>
                <th>Address&nbsp;&nbsp;<a href="#" class="RemoveColumn">Remove</a></th>
                <th>Contact&nbsp;&nbsp;<a href="#" class="RemoveColumn">Remove</a></th>
                <th id="AddColumnTh"><button style="width: 100px; height: 25px" class="addColumn">Add Column</button></th>
            </tr>
        </thead>
        <tbody>
            <tr class="prototype">
                <td><p class="RowName"></p><a href="#" class="RemoveRow">Remove</a><!--<button class="remove">Remove</button>--></td>
                <td><input type="text" name="id[]" value="0" class="id" /></td>
                <td><input type="text" name="name[]" value="" /></td>
                <td><input type="text" name="col4[]" value="" /></td>
                <td><input type="text" name="col3[]" value="" /></td>
            </tr>
    </table>
    
    <button id="test">Testing</button>

JavaScript

var rows = [];   
$('#test').on('click',function(){
$('table.dynatable tr').each(function(){
                        rows.push({
                            Id: $(this).find('td:eq(1) input').val(),
                            Name: $(this).find('td:eq(2) input').val(),
                            Address: $(this).find('td:eq(3) input').val(),
                            Contact: $(this).find('td:eq(4) input').val()
                        });
   
    });
     console.log(rows);
});