JSFiddle - React, Tailwind, and code Playground

HTML

<div align="center">
    <hr/>
    <form id="Main">
        <input type="number" id="price" placeholder="Price of the Car" />
        <br />
        <br/>
        <input type="number" id="DP" placeholder="Down Payment" />
        <br/>
        <br/>
        <input type="number" id="R" placeholder="Annual % Rate" />
        <br/>
        <br/>
        <input type="number" id="N" placeholder="# of Years Loaned" />
        <br/>
        <br/>
        <input type="button" value="Calculate" onclick="calculate();" />
        <br/>
        <br/>
        <input type="number" id="total" placeholder="Total Cost..." readonly="" />
        <br/>
        <br/>
        <input type="reset" value="Reset" />
    </form>
    <hr/>
</div>

JavaScript

function calculate() {
    var P = document.getElementById("price").value;
    var D = document.getElementById("DP").value;
    var R = document.getElementById("R").value;
    var N = document.getElementById("N").value;
    var i = (R / 1200);
    var n = (N * 12);
    var m = ((P - D) * i * Math.pow(1 + i,n)) / (Math.pow(1 + i,n) - 1);
    var result = document.getElementById('total');
    result.value = m;
 }