Not able to debug this jQuery

If you look at my sandbox site englishgodsandbox, after about 8 seconds, a drop down menu with a button "confirm" loads in the middle of the page. If you click the "confirm" button, the background image for the page should change according to the last few lines of code below.

However, the image is not changing...Can anyone tell me why?

$(document).ready(function(){       
    $(init);   
}); 

function init() {
    cloudshow();
}
function cloudshow() {
    $("#intro").fadeIn(1000, function(){
        $("#intro2").fadeIn(1000, function(){
            $("#cloud1").fadeIn(2000, function(){
                $("#cloud2, #cloud5").fadeIn(2000, function(){
                    $("#cloud3, #cloud4, #cloud6").fadeIn(2000, function(){
                        $("#message").fadeIn(1000, function() {
                            $("#contactform").fadeIn(1000)
                        });  
                    });
                });
            });
        });
    });
};



var img1 = "url('/wp-content/themes/thesis_18/custom/images/map.jpg') repeat";

$(".submit").click(function(){
    $("body.custom").css({b开发者_开发技巧ackground: img1});
});

Ok, I think I see the problem.

At the time that the last three lines there are executed, the .submit button isn't actually on the page yet.

Move those lines into your init() function and give that a try.

The init function is only being executed after the document is ready, therefore the button should be there at that time.

In order to

$(".submit").click(function(){
    $("body.custom").css({background: img1});
});

work you should ensure that $(".submit") exists, so try:

var img1 = "url('/wp-content/themes/thesis_18/custom/images/map.jpg') repeat";

$(document).ready(function(){ 
  init();   

  $(".submit").click(function(){
        $("body.custom").css({background: img1});
  });

}); 

The problem is that you reference the $(".submit") elemets before they are parsed into the DOM. Putting them in a reday event, or at the end of body would solve your problem.

$(function() {
    $(".submit").click(function(){
        $("body.custom").css({background: img1});
    });
});