JSFiddle - React, Tailwind, and code Playground

HTML

<div id="item_details" >
  <table>
    <tr>
      <td>
        <p class="label_text">Name:</p>
      </td>
      <td>
        <input name="item_name[]" type="text" value="" id="item_name" class="input_text" style="width: 126px;" />
      </td>
      <td>
        <p class="label_text">Brand:</p>
      </td>
      <td>
        <input name="item_brand[]" type="text" value="" id="item_brand" class="input_text" style="width: 126px;" />
      </td>
      <td>
        <p class="label_text">Model No:</p>
      </td>
      <td>
        <input name="model_number[]" type="text" value="" id="model_number" class="input_text" style="width: 126px;" />
      </td>
    </tr>
  </table>


 <p style="margin:-16px 0px 0px 600px;">
<a href="javascript:void(0)" name="remove_item" class='remove' id="remove_item" style="font-weight:bold;color:red;font-size:16px;">Remove Item</a>
</p>

</div>

            <div id="new_item_details" class="new_item_details">
             </div>


            <p style="margin:0px 0px 0px 0px;">

                   <a href="javascript:void(0)" name="add_item" id="add_item" style="font-weight:bold;font-size:16px;">Add New Item Here</a>

           </p>

JavaScript

jQuery(document).ready(function(){
    var id=0;
    var max=10;
    jQuery('#add_item').click(function(){

    var button = $('#item_details').clone();

    id++;
    button.find('input').val('');
    button.removeAttr('id');
    button.insertBefore('.new_item_details');
    button.attr('id','new_'+id).attr('data-id', id);
    button.find('.remove').attr('data-id',id); 


});
    jQuery(document).on('click', '.remove', function(e){
    var thisId = jQuery(this).data('id');
    jQuery('div[data-id="'+thisId+'"]').remove();
    //jQuery('#removeitem').toggle( !$("#new_item_details").is(":empty") );
    e.preventDefault();


});

});