I have a site design that uses a 'content box' in the center of a page, into which different information is loaded as required, using calls like this, to clear the space first, then load the new content:
- $("#content_space").empty();
- $("#content_space").load("18_prints.html");
This
seems to work, in that the div does become 'empty', and the new content then appears. But 'under the hood', the previous content has not been erased, but is still there. When I watch the 'Activity Window' in Safari for example (or the 'Resources' display in the browser's Web Inspector), it clearly shows the previous code as still being there. Same in Firefox, so it doesn't seem to be a browser issue.
After clicking back and forth between various menu items on my page, multiple copies of the various .html snippets loaded into this div keep building up and up.
I have tried many of the things mentioned in these forums, among them:
- $("#content_space").html('');
- $("#content_space")[0].value = "";
- $("#content_space").child().remove();
- $("#content_space").children().remove();
... but none of these make any difference. The problem gets worse if one of these inner divs contains a call to a small slideshow script that I use on the site (code is contained in a .js file linked from the outer page). The multiple copies that are hidden somewhere cause the main displaying copy to malfunction.
How can I get rid of that stuff? Any hints would be much appreciated ... thank you!
Dave Bull