Apply DatePicker to element loaded by innerHTML

I've spend two days on this dilemma so I think I'm missing something fundamental in JS.  

I have a program which loads each individual page into a <div> tag on the parent page using AJAX.  This works great.  

Issue:
I'm trying to use vlaCalendar2.1 for a DatePicker on one of the pages and also need to use the drag and drop feature of scriptaculous to resort items in a list of checkboxes on another page.  Remember, all pages are shown in a <div> tag on the parent page using innerHTML. independently each works fine, but when I put all the <script> tags on the parent document and then try to use these features they have conflicting functions.

What I've tried:
I realize I should get them to work together in case I need them both for the same form, but I wanted to try to load the JS when needed then take it away,  createElement('script').  however, when I append the scripts to the head tag (synchronously -> 1,2,3) they do not apply the datepicker to the Text box.  

Trying this technique on a separate example without the AJAX functionality works.  BUT, in that same example when I try to create another textbox using createElement the datePicker does not apply to the new element even when i rerun the last part of the script:

alert('3');
window.addEvent('domready', function() {
new vlaDatePicker('exampleI', { format: 'm/d/y' }, { prefillDate: {} });
});      


Any ideas on what am I missing here???  Suggestions on a better way to do this?  A good library of JS scripts which contains a nice datePicker and way to sort a list of <div>'s or checkboxes???


thx in advance!