"Why does THAT make the script see the whole tree?"

 

$("#sidebar").load("_toc.html");

 

alert("hello");   // why does this seem to 'refresh the DOM'?

 

 

What I have that works

My page has a TOC (in UL/LI form, where LI's have A HREF).  I want jquery to find the A HREF that matches the current URL and highlight it. Further, the jquery would collapse all of the TOC except the portion containing the particular LI (whether a subtopic, sub-subtopic, sub-sub-subtopic, etc).

 

Note that this works PERFECTLY when I have hardcoded the TOC into the page.  (My jquery selects all A HREF in #sidebar and applies bold to the one that matches the current URL. It applies classes to various ULs, blah, blah.  I love that!  jquery is cool)

 

What I want

 

Hey, the (huge) TOC content is identical across hundreds of my web pages. Ideally, I'd load that TOC content into the current page from a single _toc.html file in that folder.... and have the same wonderful jquery behavior.

 

What I have discovered so far

 

$("#sidebar").load("_toc.html");

 

This does indeed add the html characters into the page (confirmed via Firebug) but jquery has no visible effect:  styles which should be applied by jquery just are not. The toc is not expanded. Nothing is bold.

 

And let the weird begin. 

 

If I place an alert("hello") anywhere after my load(), I see the alert (and clear it) and then the TOC does its jquery thing--it expands, styles are applied, the proper link line becomes bold.

 

(What the heck? Techy curiosity:  why would alert("hello") seem to wake up the DOM or jquery or something?)

 

Suggestions on how I can make this work without having to insert a dumb alert() ? :)