JSFiddle - React, Tailwind, and code Playground

by ninadhere

HTML

<table id="userList" border="1">
<tr>
    <th>
        #
    </th>
    <th>
        User Name
    </th>
    <th>
        Action
    </th>
</tr>
<tr>
    <td>
        <input type="checkbox" name="selectUser" id="selectUser1" value="0">
    </td>
    <td>
        <input type="text" name="userName" id="userName[0]">
    </td>
    <td>
        <a id="add" href="#">+</a>
    </td>
</tr>
</table>

JavaScript

$(document).ready(function() {
 var i = 1;
$("#add").click(function() {
  $("table#userList tr:last").clone().find("input").each(function() {
    $(this).attr({
      'id': function(_, id) {  return id + i},
      'name': function(_, name) { return name + i },
      'value': function(_, value) { return '' }
    });
  }).end().appendTo("table#userList");
  i++;
});
});