JSFiddle - React, Tailwind, and code Playground

HTML

<table id="maintable" width="50%" cellpadding="0" cellspacing="0" class="pdzn_tbl1" border="#729111 1px solid" >
<tr>    <th align="center"> Roll No </th>
        <th align="center"> First Name </th>
        <th align="center"> Last Name </th>
</tr>
  <tbody>
      <tr><td>1</td><td>John</td><td>Sample</td></tr>
  </tbody>
</table>
<input type="button" name="add" value="+Add" id="addrows" style="color:#3300FF; font-size:16px; " />

JavaScript

$("#addrows").click(function(){
    $('#maintable tr:last').after('<tr><td>...</td><td>...</td><td>...</td><td>...</td></tr>');
    });