JSFiddle - React, Tailwind, and code Playground

HTML

<div id="calculator">
	<span id="calculatorHeader">Monthly Payment Calculator</span>
	<table style="margin:0 auto;">
		<tr>
		<td style="width:40px;">Term
			<input id="theTerm" size="5" value="7" name="term" style="width:35px" />
		</td>
		<td style="width:40px;">Rate(%)
			<input id="theRate" size="5" value="7" name="apr" style="width:35px" />
		</td>
		<td style="width:55px;">Price($)
			<input id="thePrice" size="6" maxlength="7" name="price" style="width:50px" value="7" />
		</td>
		<td style="width:40px;">Tax(%)
			<input id="theTax" size="4" maxlength="7" name="tax" style="width:35px" value="7" />
		</td>
		<td style="width:40px;">Down($)
			<input id="theDown" size="5" maxlength="7" name="downPmt" style="width:35px" value="7" />
		</td>
		<td style="width:40px;">Trade($)
			<input id="theTrade" size="5" maxlength="7" name="trade" style="width:35px" value="7" />
		</td>
		<td style="width:78px;">Est.Monthly Pmt
			<input id="theResult" size="7" maxlength="7" name="result" style="width:75px" value="0" />
		</td>
		</tr>
	</table>
    <button type="button" id="calculate">Add Boxes!</button>
</div>

CSS

#calculator {
	display:block;
	width:360px; height:72px;
	margin:10px auto;
	background:#EBEBEB;
	border-radius:10px;
}

#calculate {margin-top:20px;}

#calculator #calculatorHeader {
	display:block;
	width:100%; margin-top:5px; padding-top:5px;
	text-align:center; font-size:13px; font-weight:bold; color:#000000;
}

#calculator td {
	font-size:10px;
}

#calculator input {
	margin-top:5px; border: #CCC 1px solid;
	-moz-box-shadow: inset 0 0 4px 0 #CCC;
	-webkit-box-shadow: inset 0 0 2px 0 #000;
	box-shadow: inset 0 0 2px 0 #000;
	font-weight:bold; text-align:right;
}

JavaScript

$(document).ready(function() {
    
var theTerm = $("#theTerm").val();
var theRate = $("#theRate").val();
var thePrice = $("#thePrice").val();
var theTax = $("#theTax").val();
var theDown = $("#theDown").val();
var theTrade = $("#theTrade").val();
var theResult = parseInt(theTerm + theRate + thePrice + theTax + theDown + theTrade, 10);

    $("#calculate").click(function(){
	    alert(theResult);
	    alert(typeof(theResult));
    });

});