jQuery UI calendar from a clone opens up calendar from initial textbox. how can I open up the cloned calendar?

I have a table (has more info than this, but to save space I removed the extra fields) and inside this table, I am using jQuery UI calendar datepicker.

<table class="formInfo" cellpadding="0" cellspacing="0" id="newShowToVenue">  
<tr>
    <td><img src="img/information.png" alt="help" width="16" height="16" class="help" title="Date" /></td> 
    <td>Date</td>
    <td class="datepicker_box"><input name="show_date[]" id="show_date" class="datepicker" type="text" value="$showDate" /></td>
</tr>

I also have the jQuery to clone the table and clear the fields from the new table that's cloned.

$("#addShow").click(function(){
    var toClone = $("#newShowToVenue");    
    $(toClone).clone(true).insertBefore($('#insertBefore')).find("input").attr("value","");
    return false;
});

I am running into the issue where the cloned table's datepicker opens up the original datepicker and will not let me add the date to the new cloned table.

I have tried several options that I found here, and none seem to do the trick. If anyone could开发者_如何学JAVA please help and guide me on how to do this, that would be great. Thanks in advance.

---

Ok. so from reading another post here, and trying several of them to no avail, I finally got one that worked. Decided to add it here, just in case someone else sees this with the same issue.

so you can see the original on top, here is the one that worked.

$("#addShow").click(function(){
$('input.datepicker').datepicker("destroy");
newDiv = $(toClone).clone(true).insertBefore($('#insertBefore'));
newDiv.find("input").attr("value","");  
$('input.datepicker').datepicker();
return false;

});

Hopes this helps someone. I spent too much time trying to figure this stuff out.