jQuery DatePicker Gotcha - Don't call it twice

I spent several hours tracking down an issue with the jQuery date picker control today and discovered a bit of a gotcha. I was displaying a simple table, with dynamically created editable rows that contained date controls. When the table was first created, the date picker in each row worked fine. But after hiding and updating the table the date pickers did not work.

I thought initially that it was an issue with z-indexing and that the date picker was being displayed, just behind the dialog containing the table. Working on this assumption, I spent a while fighting with z-index settings in the jquery-ui css file as suggested in various online postings.

After looking at my code though, I realized that I was running this code after updating my table to enable the date picker on new rows:

   1:  this._editor().find('.DateEntry').datepicker(opt);

The problem was that I wasn't deleting all the rows in my table and recreating, I was only updating a subset of rows and adding a few new ones. Thus I was calling the date picker function on an element that had already been enabled as a date picker. This prevented any elements from being made into date pickers.

Moral of the story, never call datepicker() twice on the same element. Bad mojo.