JavaScript to add more fields to form

Question

I'm posting this again, this time including the code that works.

I have a form that has a block called "Product", containing text inputs. Inside that block, the user can press "add item" and have the JS show one more field. Till now everything works.

I've tried to add a function for adding a new "Product" block but no luck. Do you have any hints for me?

Product
Item: <input> Price: <input>
Item: <input> Price: <input>
              <a>add item</a>  <- this works

<a>add Product</a>             <- this is the part that I can't figure out :(

Any help will be appreciated.

Here is the working code (except I the Product Category that I have no idea on how to add more):

<div class="product-field">                 
<span class="category"><label for="category">Product Category</label><input type="text" name="Category" /></span>  
<script type="text/javascript">
    $(document).ready(function(){
    var counter = 2;
    $("b.add-item").click(function () {
    if(counter>5){ alert("Max 6 items allowed"); return false; }   
    var newTextBoxDiv = $(document.createElement('div'))
         .attr("id", 'TextBoxDiv' + counter);
    newTextBoxDiv.after().html(
          '<span class="item">' +
          '<label>Item:</label>'+
          '<input type="text" name="item1[]" id="textbox' + counter + '" value="" >' +
          '<label>&nbsp;&nbsp;&nbsp;Price:</label>'+
          '<input type="text" name="price1[]" id="textbox' + counter + '" value="" >' +       
          '</span>'
           );
    newTextBoxDiv.appendTo(".items");
    counter++;
     });
    $("b.remove-item").click(function () {
    if(counter==1){alert("No more textbox to remove");
    return false; }     counter--;
    $("#TextBoxDiv" + counter).remove();});
    $("#getButtonValue").click(function () { var msg = '';  for(i=1; i<counter; i++){ msg += "\n Textbox #" + i + " : " + $('#textbox' + i).val();  }alert(msg);   });
  });
</script>
<span class="item">
<label>Item:</label><input type="text" name="item1[]" />

<label>&nbsp;&nbsp;&nbsp;Price:</label><input type="text" name="price1[]" />
                    </span>                                                                                                
</div>
<span class="buttons"><b class="add-item">Add Item Field</b><b class="remove-item">Remove Item Field</b></span> 

</div>

Thank you!