JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="main" style="list-style-type:none;">
<li class="append_list">
  <label>Product 1</label> <input type="text">
  <br>
   <label>Product 2</label> <input type="text">
  <br>
   <label>Product 3</label> <input type="text">
  <br>
   <label>Product 4</label> <input type="text">
  <br>

</li>
</ul>
<button id="add" style="clear:both">ADD NEW PRODUCTS</button>-

JavaScript

$("#add").click(function () {           
     //$('.main').append('<br>');
       $('ul.main').append($(".main").html());
     $('.main li:last').append(
     "<button class='rmv_btn' style='clear:both'> Remove </button>");   
    }); 

$(document).on("click", ".rmv_btn", function () 
    {
       $(this).closest('li').remove();

    });