jquery - Adding tax total based on tax name for each type of tax -

i have created invoice page below format

item name desc discount unitprice tax1 tax2 price 

at below there

 subtotal   540    vat @5%  550    tax2@12% 430    tax3@13% 543     ....     total    

here each item have maximum 2 taxes want display tax based on tax name , each item sum of taxes total

for tax 1 i'm using:

<span id="item_tax1">    <input type="text" name="tax1name" value="vat" class="tax1name tax input-mini"/>     <input type="hidden" name="tax1value" value="5" class="tax1value input-mini"/>    <input type="hidden" name="tax1"  value="44" class="tax1 input-mini"/>  </span> 

for tax 2 i'm using:

<span id="item_tax2">    <input type="text" name="tax1name" value="service" class="tax2name tax input-mini"/>     <input type="hidden" name="tax2value" value="4" cssclass="tax2value input-mini"/>    <input type="hidden" name="tax2"  value="45" class="tax2 input-mini"/>  </span> 

i calculating tax tax 1 , tax 2 , storing <input type="hidden" name="tax1" class="tax1 input-mini"/> , tax 2 @ class="tax2"

now want add taxes price according tax name shown above. how achieve this?

var taxes = {},      total = 0;    $('.tax').each(function(){    var elm = $(this),        name = elm.val(),        amount = elm.next().val();      if (!taxes[name]) {      taxes[name] = 0;    }    taxes[name] += parsefloat(amount);    total += parsefloat(amount)  });    (var tax in taxes) {    $('<div />').html(tax + ': ' + taxes[tax]).appendto('#result');  }    $('#result').append('total: ' + total);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <table>    <tr>      <td>        vat1      </td>      <td>        vat2      </td>    </tr>    <tr>      <td>        <input type="text" name="tax1name" value="vat" class="tax1name tax input-mini"/>         <input type="text" name="vat1" value="10" cssclass="tax1value input-mini"/>       </td>      <td>        <input type="text" name="tax2name" value="servicetax" class="tax1name tax input-mini"/>         <input type="text" name="vat2" value="23" cssclass="tax2value input-mini"/>       </td>    </tr>    <tr>      <td>        <input type="text" name="tax1name" value="education" class="tax1name tax input-mini"/>         <input type="text" name="vat1" value="42" cssclass="tax1value input-mini"/>       </td>      <td>        <input type="text" name="tax2name" value="vat" class="tax1name tax input-mini"/>         <input type="text" name="vat2" value="55" cssclass="tax2value input-mini"/>       </td>    </tr>    <tr>      <td>        <input type="text" name="tax1name" value="servicetax" class="tax1name tax input-mini"/>         <input type="text" name="vat1" value="68" cssclass="tax1value input-mini"/>       </td>      <td>        <input type="text" name="tax2name" value="education" class="tax1name tax input-mini"/>         <input type="text" name="vat2" value="66" cssclass="tax2value input-mini"/>       </td>    </tr>  </table>    <div id="result"></div>