JSFiddle - React, Tailwind, and code Playground

HTML

<table id="table_fields">
<tr>
  <td></td>
  <td>Is Member</td>
  <td>Membership Number</td>
</tr>

<tr>
<td class="firstcell">1</td>
<td><select name="is_member[]" ><option value="">Select</option><option value="Yes">Yes</option><option value="No">No</option></select></td>
<td><input name="membership_number[]" value=""></td>
<td></td>
</tr>
</table>
<br><br>
<div class="text-center"><input type="button" name="add" id="add_row" class="btn btn-primary"  value="Add Input Row" tabindex="-2">	</div>

JavaScript

var html_row = '<tr><td class="firstcell"></td><td><select name="is_member[]" ><option value="">Select</option><option value="Yes">Yes</option><option value="No">No</option></select></td><td><input name="membership_number[]" value=""></td><td><input type="button" name="remove" id="remove_row" class="btn btn-info"  value="Remove This Section" tabindex="-1"></td></tr>';

var max = 50;
    var x = 1;
    
    $('#add_row').click(function(){
        if(x <= max){
            $('#table_fields').append(html_row);  
            var els = $(".firstcell");
				for (var i = 1; i < els.length; i++) {
					els[i].innerHTML = i+1;
           		 $("select[name='is_member[]']").on('change', function() {
              
                    var member_status=$(this).val();
                    if(member_status=="No"){
                        $("input[name='membership_number[]']").val("Not Member");
                    }else{
                        $("input[name='membership_number[]']").val("");
                    }           
            	});             
         }    
         }
        });           
    

    $('#table_fields').on('click', '#remove_row', function(){
        $(this).closest('tr').remove();
        x--;
    });