Why wont ID number jump to the next one
<p>There is a one section of orders page where users can add new fields to add new products. The problem here is, every time user adds new fields, new fields should have names as PRODUCTNAME1, PRODUCTNAME2, PRODUCTNAME3, and so on. Right now, every new field added has 1 value. Its stuck there. I hope I made some sense.</p>

<pre><code>$('#AddProduct').click(function() {
    var i = 0;
    var adding = $(+(i++)+'&lt;div class="row'+(i)+'"&gt;&lt;div class="column width50"&gt;&lt;input type="text" id="PRODUCTNAME" name="PRODUCTNAME'+(i)+'" value="" class="width98" /&gt;&lt;input type="hidden" class="PRODUCTID" name="PRODUCTID" /&gt;&lt;input type="hidden" class="UNITPRICE" name="UNITPRICE'+(i)+'" value="" /&gt;&lt;input type="hidden" class="TOTALPRICE" name="TOTALPRICE'+(i)+'" value="" /&gt;&lt;small&gt;Search Products&lt;/small&gt;&lt;/div&gt;&lt;div class="column width20"&gt;&lt;input type="text" class="UNITQUANTITY" name="UNITQUANTITY'+(i)+'" value="1" class="width98" /&gt;&lt;small&gt;Quantity&lt;/small&gt;&lt;/div&gt;&lt;div class="column width30"&gt;&lt;span class="prices"&gt;Unit Price:&lt;span class="UNITPRICE"&gt;&lt;/span&gt;&lt;br /&gt;Total Price:&lt;span class="TOTALPRICE"&gt;&lt;/span&gt;&lt;br /&gt;&lt;a href="#" id="RemoveProduct(".row'+(i)+'");"&gt;Remove&lt;/a&gt;&lt;/span&gt;&lt;/div&gt;');    
    $('#OrderProducts').append(adding);

    adding.find("#PRODUCTNAME").autocomplete("orders.cs.asp?Process=ListProducts", {
        selectFirst: false
    }).result(function(event, data, formatted) {
        if (data) {
            adding.find(".UNITPRICE").val(data[1]);
            adding.find(".UNITPRICE").html(data[1]);
            adding.find(".PRODUCTID").val(data[2]);
            adding.find(".TOTALPRICE").val(data[1] * $('.UNITQUANTITY').val()); 
            adding.find(".TOTALPRICE").html(data[1] * $('.UNITQUANTITY').val()); 
        }
    });

    adding.find(".UNITQUANTITY").change(function()
    {
        adding.find(".TOTALPRICE").val(adding.find(".UNITPRICE").val() * adding.find(".UNITQUANTITY").val()); 
        adding.find(".TOTALPRICE").html(adding.find(".UNITPRICE").val() * adding.find(".UNITQUANTITY").val()); 
    });


    return false;
});
</code></pre>
