JSFiddle - React, Tailwind, and code Playground

HTML

<table>

</table>
<input type="button" id="btn_add" value="click me">


<script type="text/javascript">
  $(document).ready(function() {

    var n = 0;

    $('#btn_add').click(function() {
      n++;
      
      var html = '<tr id="btn_minus' + n + '">' +
      '<td><input type="text" name="cost_element" value="0" readonly/></td>' +
      '<td><input type="text" name="description"  value="{{cost_element.description}}"/></td>' +
      '<td><input type="text" class="usd_value"   value="15"/></td>' +
      '<td><input type="text" class="pesos_value" value="10"/></td>' +
      '<td><input type="text" class="percent"     value="5" size=3 />%</td>' +
      '<td><input class="btn_minus btn btn-danger" type="button" value="X"/></td>' +
      '</tr>';
      
      $('table').append(html);
      
    });

    $('table').on('click', ".btn_minus", function() {
      //var id = $(this).attr('name');
      //$('tr[id="' + id + '"]').remove();
      $(this).closest('tr').remove(); // more simple
    });
    
    $('table').on('change', '.usd_value', function() {
      pesos_value = $(this).closest('tr').find('.pesos_value');
      percent = $(this).closest('tr').find('.percent');
      
      $(pesos_value).val($(this).val() * $(percent).val());
      
    });
    
    
    $('.btn_delete').click(function() {
      location.href = "";
    });

  });
  //});

</script>