JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://192.168.3.30/employees/js/jquery.calculation.js"></script>
<form method="post" action="" enctype="multipart/form-data" name="expense">
  
    
   <div id="items">
    <h2><a href="#" id="addItem">Add New Row</a></h2>
	
    <table id="itemsTable">
    <thead>
    <tr>
    <th>ENTMT.</th>		
    <th>MEALS*</th>		
    <th>OTHER</th>	
    <th>TRAVEL</th>	                		
    <th>LODGING</th>	
    <th>HST</th>
    <th>Total</th>
    </tr>	
	</thead>
	<tbody>
	<tr>

    <td>
        <label for="entmt">$<input type="text" id="sum" size="10" name="entmt" value="" placeholder="0.00" /></label>
    </td>
    <td>
        <label for="meals">$<input type="text" id="sum" size="10" name="meals" value="" placeholder="0.00" /></label>
    </td>
    <td>
        <label for="other">$<input type="text" id="sum" size="10" name="other" value="" placeholder="0.00" /></label>
    </td>
    <td>
        <label for="travel">$<input type="text" id="sum" size="10" name="travel" value="" placeholder="0.00" /></label>
    </td>
    <td>
        <label for="lodging">$<input type="text" id="sum" size="10" name="lodging" value="" placeholder="0.00" /></label>
    </td>
    <td>
        <label for="hst">$<input type="text" id="sum" size="10" name="hst" value="" placeholder="0.00" /></label>
    </td>
      <td>
        <label for="total">$<input type="text" name="totalSum" id="totalSum" value="" size="10" readonly="readonly" /></label>
    </td>
	</tr>
    </tbody>
    </table>
    
  	
</div>

<br><br>
&nbsp; <label for="total">Total: $<input type="text" name="totalSum" id="totalSum" value="" size="15" readonly="readonly" /></label>
<br><br>  


</form>

JavaScript

//Code Snippets
//    JS Calculations: http://www.pengoworks.com/workshop/jquery/calculation/calculation.plugin.htm
//    Add/Remove Input Fields: http://jsfiddle.net/jaredwilli/tZPg4/4/



var bIsFirebugReady = (!!window.console && !!window.console.log);

	$(document).ready(function (){

			$("input[id^=sum]").sum("keyup", "#totalSum");			

			$(function() {
				
				//Increment Variables
			    var items = $('#items');
			    var i = $('#items td').size() + 1;
			    var mileage = $('#mileage');
			    var j = $('#mileage td').size() + 1;

			    //Append Table Rows
			    $('#addItem').on('click', function() {
			            $('<tr><td>$<label for="entmt"><input type="text" id="sum_' + i +'" size="10" name="entmt_' + i +'" placeholder="0.00" /></label></td>' +
			              '<td>$<label for="meals"><input type="text" id="sum_' + i +'" size="10" name="meals_' + i +'" placeholder="0.00" /></label></td>' +
			              '<td>$<label for="other"><input type="text" id="sum_' + i +'" size="10" name="other_' + i +'" placeholder="0.00" /></label></td>' +
			              '<td>$<label for="travel"><input type="text" id="sum_' + i +'" size="10" name="travel_' + i +'" placeholder="0.00" /></label></td>' +
			              '<td>$<label for="lodging"><input type="text" id="sum_' + i +'" size="10" name="lodging_' + i +'" placeholder="0.00" /></label></td>' +
			              '<td>$<label for="hst"><input type="text" id="sum_' + i +'" size="10" name="hst_' + i +'" placeholder="0.00" /></label></td>' +
			              '<td>$<label for="total"><input type="text" id="totalSum_' + i +'" size="10" name="total_' + i +'" placeholder="0.00" readonly="readonly" /></label></td>' +
			              '<td><a href="#" id="remItem">Remove</a></td></tr>').clone(true).insertAfter('#itemsTable tbody>tr:last'); //.appendTo(items);
			            $("input[id^=sum_" + i).sum("keyup", "#totalSum_" + i);
			            
			            //$('#totalSum_' + i).val($('#totalSum_' + i).val() +...