JSFiddle - React, Tailwind, and code Playground

by dying_sakura

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.1.3/js/bootstrap.min.js"></script>
 <button type="button" class="btn btn-success" id="AddLine" style="float: right;">+ ADD ENTRY</button>
 
   <table class="table table-bordered" border="1" class="classtable" id="applicanttable">
     
     
     <tr>
                <th>#</th>
                <th>LB#</th>
                <th>Weight#</th>
                <th>Wingband #</th>
                <th>Action</th>
             </tr>
     
            <tbody class="appendtablee" id="wew">
            
                   
          </tbody>


 </table>

JavaScript

$("#AddLine").click(function () {
        var row = "<tr><td></td><td><input type='text' name='legBand[]' id='legBand1' /> <span class='email_result'></span></td><td><input type='text' data-id='weight'  name='Weight[]' min='1700' max='2200' /></td><td><input type='text' name='Wingband[]' /></td><td><button style='float:left;' class='removerow btn btn-danger'>X REMOVE ENTRY</button></td></tr>";
        $("#wew").append(row);
    });

$("#wew").on("click", ".removerow", function() {
   $(this).closest("tr").remove(); 
   
       $('input').keypress(function(e){
        if(e.which==13){ 
            $("[tabindex='"+(parseInt($(this).attr("tabindex"))+1)+"']").focus();
            e.preventDefault();
        }
    });   
});