Javascript / jQuery - multiple change (function ()

Question

I am a little new to jQuery / JS and have helped a bit. I understand that I hope this is a much better way to do this, and any help would be greatly appreciated.

I am creating a form that can calculate the total. I.e:

'Cost' x '(1 + percent (%))' = 'total cost'

It works fine for me, although I want to make it so that if I change the " percentage " field or the " cost " field, then the total amount . At the moment, only if you update the " cost " will there be a general update .

Hope this makes sense. The code is below.

$(document).ready(function(){ $("#cost").change(function() { var findprofit = parseFloat($("#cost").val()); var profit = (findprofit*.01) var margin = parseFloat($("#percentage").val()); var total = profit*margin; $(".profit_1_1").html(total); var totalprofit = (total + findprofit); $("#total").val(totalprofit); }); <input type="text" name="cost" id="cost" /> <input type="text" name="percentage" id="cost" percentage /> <input type="text" name="total" id="total" readonly /> 

Answer 1

 $("#cost, #percent").change(function() { ... }); 

Gotta do the trick.

Edit: you need to specify your percentage input of the "percent" identifier. Two elements may not have the same identifier.

 <input type="text" name="cost" id="cost" /> <input type="text" name="percentage" id="percent" percentage /> <input type="text" name="total" id="total" readonly /> 

Also, I'm not sure if this “percentage” is at the end of the input. Percentage is not a valid attribute.