JSFiddle - React, Tailwind, and code Playground

HTML

<tr>
					<th><button class="add_field_button11">Add </button> </th>
					<th>
							 
					     	<div class="input_fields_wrap11">
					     		<input type="text" class="pets" name="super_stars_winner#CurrentRow#" size="35" value="#super_star#" > 
					     		
								<a  class="remove_field">Remove</a>
						
						</span>
						
						<div class="input_fields_wrap12">
							
						</div>
						<th>
					
</tr>

<tr>
					<th><button class="add_field_button14">Add </button> </th>
					<th>
							 
					     	<div class="input_fields_wrap14">
					     		<input type="text" class="pets"  name="superStarRunnerup#CurrentRow#" size="35" value="#superstarrunner#" >
					     		
								<a  class="remove_field">Remove</a>
						
						</span>
						
						<div class="input_fields_wrap13">
							
						</div>
						<th>
					
</tr>

JavaScript

$(document).ready(function() {
    var max_fields3      = 30; //maximum input boxes allowed
    var wrapper3         = $(".input_fields_wrap12"); //Fields wrapper
    var add_button3      = $(".add_field_button11"); //Add button ID
    var wrapper6         = $(".input_fields_wrap11"); //Fields wrapper
    var x = 1; //initlal text box count
    $(add_button3).click(function(e){ //on add input button click
        e.preventDefault();
        if(x < max_fields3){ //max input box allowed
            x++; //text box increment
            $(wrapper3).append('<div>   <input type="text" class="pets" name="super_stars_winner#CurrentRow#" size="35"  > <a href="#" class="remove_field"> Remove</a></div>'); //add input box
    

        } 
          $(document).ready(function() {
        $('.pets').autocomplete({
            source: function(query, response) {
                $.ajax({
                    url: "search.cfc?method=queryNames&returnformat=json",
                    dataType: "json",
                    data: {
                        searchPhrase: query.term
                    },
                    success: function(result) {
                        response(result);
                    }
                });
            }
        });
    });
    });
    
    $(wrapper3).on("click",".remove_field", function(e){ //user click on remove text
        e.preventDefault(); $(this).parent('div').remove(); 
		x--;
    })
     $(wrapper6).on("click",".remove_field", function(e){ //user click on remove text
        e.preventDefault(); $(this).parent('div').remove(); 
		x--;
    })
});