Using Javascript to reload content (without reloading the page) containing Javascript

Hi all,
How to use javascript to reload content containing javascript the needs to be run (without reload the page)?

For example, I have a simple page container.html that loads the content of newContent.html into its DIV:

1. [container.html]
<script><!--
function changeContent (id) {
// script that replace content of <DIV> with newContent.html
}
-->
</script>
<a onclick="changeContent('box)">Change Content</a>
<div id="box">Default Contents Goes Here</div>

2. [newContent.html]
New Content Is Now Here, With JS
<script><!--
alert ("new content loaded");
-->
</script>


I have no problem with the JS loading the new content. The problem here is, after the stuffs from newContent.html is loaded into the <DIV> on container.html, the JS does not run. What is a possible solution?

Many Thanks!

 

erm, i think the problem is here:

"// script that replace content of <DIV> with newContent.html"

you can't seriously be expectant of real help with pseudo code like this?

i can tell you that it depends on the XHR framework/lib you use, but for example, in mootools you define a Request.html like so:

$("box").set("html", new Request.HTML({
    url: "/blah.php",
    evalScripts: true,
    onSuccess: function(responseTree, responseElements, responseHTML, responseJavaScript) {
        // can do stuff here if we don't want to do it direct to $("box");
    }
});

PHP:

in other words, you need to look for scripts within the response and run/eval them. good luck.