Question

Possible Duplicate:
Initialize script

I have a page (Page1.html) and in this page a div (#div1) that get its content from other divs in another page (Page2 #div1/2/3/4/5). The content is loaded in by jQuery load script. The content is loaded in based on choice in a select box, so the content is loaded in after Page1 has finish loaded.

Problem:
When I get some content from Page2 that’s depending on jQuery, these elements don’t work. They don’t execute.

My questions:
Is there any way to make the a whole inloaded #div from Page2 (all the content) to execute WHEN its loaded in? Right now the existing elements “initialize” when they are loaded in, for example: function initializeSlider(){ slider };.

Now I am trying to add in some more elements depending on jQuery, and wounder if initializing all the objects is the correct way of execute all these scripts, or is there any way that execute all the jQuery elements at once so no need to initializing all object one by one?

Executing or Initializing one script:
If there is no way to execute/initialize all scripts at once when a div is loaded in. I am trying to execute or initialize this script without success, have tried both the “$(document).ready(function() {” and initialize it similar to the slider but the element is not executing.

$(document).ready(function() {
    $(".lil").click(function () {
      $(this).toggleClass("highlight");
    });
});

Answer 1

Use:

$(document).ready(function() {
    $("#div1").on('click', '.lil', function () {
      $(this).toggleClass("highlight");
    });
});