jQuery Forum

I have a form with a DIV that contains information regarding 1 person in a family. The DIV, all the input IDs and Names terminate with _1. If the user wishes to add another person to the family they push a button and this jQuery call creates a new DIV and elements all with the _2 ID and name by calling the clone function.

1.   $("#butt").click(function(){
2.     var num = parseInt($("#playerCount").val());
3.     $("#playerCount").val(num +1);
4.     $("#player_"+num).clone(true).attr('id','player_'+(num +1)).insertAfter("#player_"+num);
5.     var new_player_div_inputs ="#player_"+(num+1)+" input";
6.     $(new_player_div_inputs).each(function(index){
7.        var id = $(this).attr("id");
8.        var new_id = id.substring(0,id.indexOf("_")+1)+(num +1);
9.        $(this).attr("id", new_id);
10.        $(this).attr("name", new_id);
11. });


and one of these inputs is a datepicker field

The problem arises from the cloned DIVs and the datepicker plugin. When I put the focus into one of the newly cloned datepicker fields the popup appears but any input always end up in the first DIV. It works fine if I put many fields in as HTML like this:

1. <input id="bDate_1" class="datepicker" type="text" value="" name="bDate_1">
   <input id="bDate_2" class="datepicker" type="text" value="" name="bDate_2">
   <input id="bDate_3" class="datepicker" type="text" value="" name="bDate_3">

But not when the DIV is cloned.

I do see this though in the firebug / fireQuery output:

1. <input id="<strong>bDate_1</strong>" class="datepicker" type="text" value="" name="<strong>bDate_1</strong>">jQuery16101687445242816391=Object { events={...}}datepicker=Object { id="<em>bDate_1</em>", input={...}, more...}
   <input id="<strong>bDate_2</strong>" class="datepicker" type="text" value="" name="<strong>bDate_2</strong>">jQuery16101687445242816391=Object { events={...}}datepicker=Object { id="<em>bDate_1</em>", input={...}, more...}

As you can see at the end,  the datepicker object still thinks the bDate_2 input has the jQuery Object of bDate_1.

Any idea how to get the datepicker to populate the correct fields?
I've got a temp place to look at the issue here at http://www.kevinmeek.ca/WORA_Trial/r2.php

Thanks,
Kevin