Работа с динамически создаваемыми входными массивами в jQuery

Question

У меня есть динамическая форма со следующими полями

<tr>
 <td><input name = "qty[]" /></td>
 <td><input name = "color[]" /></td>
 <td><input name = "price[]" /></td>
 <td><input name = "total[]" /></td>
</tr>

Я могу динамически добавлять столько строк, сколько захочу. То, что я хотел бы сделать, это иметь общую = qty * цену для каждой строки нажатием кнопки. Есть предложения?

Answer 1

Немного изменил ваш HTML

<tr>
 <td><input name = "qty[]" /></td>
 <td><input name = "color[]" /></td>
 <td><input name = "price[]" /></td>
 <td><input name = "total[]" /></td>
 <td><input type='text' name='total' /></td>
</tr>

jQuery код

$("#button1").click(function(){
    var trElems = $("#tab tr");

    trElems.each(function(){
        var qty = $(this).find("input[name='qty[]']").val();
        var price = $(this).find("input[name='price[]']").val();
        var total = parseFloat (qty) * parseFloat (price);

        $(this).find("input[name='total']").val(total);
    });

См. рабочая демонстрация