总结动态html表中的表文本字段值

Question

您好我想在动态表中总结相同类别的总数。

请参阅Jsfidle http://jsfiddle.net/Z7fG7/129/

中的代码

要汇总的动态表类别，应设置为下表请帮助我被卡住

<table id="test">
<tr>
    <td>Category</td>
    <td>Quantity</td>
<tr>
    <td><input type="text" value="Mango" /></td>
    <td><input type="text" value="2" /></td>
    </tr>
     <tr>
    <td><input type="text" value="Apple" /></td>
    <td><input type="text" value="2" /></td>
    </tr>
     <tr>
    <td><input type="text" value="MuskMelon" /></td>
    <td><input type="text" value="2" /></td>
    </tr>
</table>
<input type="button" value="Add" id="addCategory" onclick="AddCategory()" />

<h2>Result Table</h2>
<table>
    <tr>
    <td>Total Mango</td>
    <td><input type="text"  /></td>
    </tr>
    <tr>
    <td>Total Apple</td>
    <td><input type="text"  /></td>
    </tr>
    <tr>
    <td>Total MuskMelon</td>
    <td><input type="text"  /></td>
    </tr>
</table>

的Javascript

 var i = 1;

 $(document).on('click', 'button.addCategory', function () {

     var tableRow = "<tr><td><select><option>Mango</option><option>Appple</option><option>MuskMelon</option></select></td><td><input type=text/></td></tr>";
    $('#test').append(tableRow);

     return false;
 });

 $(document).on('click', 'button.removebutton', function () {
     alert("aa");
     $(this).closest('tr').remove();
     return false;
 });