Real Time Javascript Calculator For HTML Inputs

calculate.html

 <input class="input" id='first' type="text" class="form-control formBlock" name="bus_ticket"  placeholder="Bus Ticket..." required/><br />

<input class="input" id='second' type="text" class="form-control formBlock" name="plane_ticket"  placeholder="Plane Ticket..." required/><br />

<input class="input" id='third' type="text" class="form-control formBlock" name="hotel_expenses"  placeholder="Hotel Expenses..." required/><br />

 <input class="input" id='fourth' type="text" class="form-control formBlock" name="eating_expenses"  placeholder="Eating Expenses..." required/><br />

Total : <input id='total_expenses' type="text" class="form-control formBlock" name="funding"  placeholder="Total Expenses..."/>

input.script

$('.input').keyup(function(){ // run anytime the value changes


    var firstValue = Number($('#first').val()); // get value of field
    var secondValue = Number($('#second').val()); // convert it to a float
    var thirdValue = Number($('#third').val());
    var fourthValue = Number($('#fourth').val());

    $('#total_expenses').val(firstValue + secondValue + thirdValue + fourthValue); // add them and output it
});