JSFiddle - React, Tailwind, and code Playground

HTML

<table class="dataTable" id="CADataTable">
<thead>
	<tr>
	    <th> Type</th>
        <th> Name</th>
	    <th> Adress</th>
        <th> ID Number</th>
		<th> Contact</th>
		<th> Note</th>
	</tr>	
</thead>
<tbody>
	<tr>		
        <td><input type="text" name="CAType" style="width: 9em;"></td>
		<td><input type="text" name="CAName" style="width: 15em;"></td>
        <td><input type="text" name="CAAdress" style="width: 15em;"></td>
		<td><input type="text" name="CAIdNum" style="width: 6em;"></td>
		<td><input type="text" name="CAContact" style="width: 10em;"></td>
		<td><input type="text" name="CANote" style="width: 15em;"></td>
	</tr>
</tbody>
</table>
<button type="button" id="export" class="button" onClick="test()">ADD</button>

JavaScript

test = function(){
	   $('#CADataTable tr:last').after('<td>test</td><td>test</td><td>test</td><td>test</td><td>test</td><td>test</td>');
};