jquery use in a page with multiple panels

jquery use in a page with multiple panels

The question I have is more theory/best practice question.  I'll tell you my goal (which I've been working for some time but have yet to find an elegant solution) and what I've tried.  I'd like to hear how more experience programmers would approach the problem. 


Before I started using jquery it seemed very simple.  the page.html would be divided into 2 main <div> tags. I would use ajax to load an external webpage content.html into area 2.  Things worked great, The most important was that it allowed for separate files for content, keeping things very neat.

When I started using jquery, I had to use the jquery load method, and live()  to allow the jquery ui datepicker to function(or any jquery code) from the dynamically loaded page.  At this point, things were working well except that the datepicker would not show until you first had to click the field, click off of the field, and click the field again.  I was told that using  a callback on .load() would work.  It did, which brings us to the current problem. Area 2 is going to have a lot of various pages and information that may be shown at any given time (all contained within separate pages)  It would be difficult to use callback functions for every page that may be displayed.  It makes it so that I can't compartmentalize the content into separate files because the jquery code basically has to be in the main page, not within the separate html files.

How would you guys approach this situation? Even if I have to start fresh with a totally new approach I'd be up for it. I see this type of layout all over so i'm wondering how others accomplish it.  Thanks.