JSFiddle - React, Tailwind, and code Playground

HTML

<div class='col-md-2'>
    <input type='text' class='form-control qty' pid='pro_id' id='qty_pro_id'  ></div>
    <div class='col-md-2'><input type='text' class='form-control price' pid='pro_id' id='price_pro_id' ></div>
    <div class='col-md-2'><input type='text' class='form-control total' pid='pro_id' id='total_pro_id' disabled>
</div>

JavaScript

$("body").delegate(".qty,.price","keyup", function(){   

  var pid = $(this).attr("pid");              
  var qty = $("#qty_"+pid).val();
  var price = $("#price_"+pid).val();
  var total = qty * price;        
  alert(total);
})