JSFiddle - React, Tailwind, and code Playground

HTML

<table class="table">
	  <thead>
		 <tr>
			 <th>Sl No</th>
			<th>Item</th>
			<th>Current Quantity</th>
			<th>Procuring Quantity</th>
			<th>Updated Quantity</th>
		 </tr>
	  </thead>
	  <tbody>
         <tr class="info">
            <td>1</td>
            <td><input type="text" name="name[]"  id="contact_name" required="required" class="form-control" value="name" readonly></td>
            <td><input type="text" name="current[]" required="required" class="form-control" value="3"></td>
            <td><input type="text" name="procuring[]"  id="procuring" required="required" class="form-control"></td>
            <td><input type="text" name="updated[]"  id="updated" required="required" class="form-control"></td>
          </tr>
          <tr class="info">
            <td>1</td>
            <td><input type="text" name="name[]"  id="contact_name" required="required" class="form-control" value="name" readonly></td>
            <td><input type="text" name="current[]" required="required" class="form-control" value="3"></td>
            <td><input type="text" name="procuring[]"  id="procuring" required="required" class="form-control"></td>
            <td><input type="text" name="updated[]"  id="updated" required="required" class="form-control"></td>
          </tr>
      </tbody>
</table>

JavaScript

$(function(){
  // bind change event to procuring quantity
  $('input[name="procuring[]"]').change(function(){
    var $parentTR = $(this).closest('.info');
    // read value for current quantity.
    var current = $parentTR.find('input[name="current[]"]').val();

    // read value for procuring quantity.
    var procuring = $(this).val();

    // do substraction and set value in 5th column for updated quantity.
    var updated = parseFloat(current) - parseFloat(procuring);
 $parentTR.find('input[name="updated[]"]').val(updated );
  });
});