how to preload html content into a div ?

how to preload html content into a div ?

_toc.html is a large file with "table of contents" content that I load into a specific DIV and then manipulate its style with jquery. (I like this approach for presenting the same content in all 100 web pages that need it.)

It works so far BUT the rest of the web page appears first, and 2 seconds later, the DIV content appears.

How do I get the DIV content to appear at the same time as the rest of the page?

My current code:

// the callback
var loaded = function() {
    styleTheTocNav();  // acts on the loaded _toc content
    highlightTOC();    // ditto
}


// called on document ready
var docs = {
  init: function() {
        // the loader
        $("#tocnav").load("_toc.html", loaded);

        ... // display and style the rest of the page
    }
}


$(function() {
  docs.init();
});


---


This js file is called as the last action in <body>.  (I have also tried placing the <script> line inside <head>. No luck.)

Thanks
oak island