jQuery - removing an alert stop code from working

The code below works, but there is an issue with it.

That issue is that unless the alert(this.href); - (about line 11) is in the code the following function does not work.

//There are pages which make up 2 chapters in this content
//We shall attempt to grab all the links from these pages
var c;
var chapters = new Array();
chap开发者_开发技巧ters[0] = "original/html/0/ID0EFJAE.html";  

//Loop through each page of links
$.each(chapters, function(key, value) { 
    $("#theContent").append("<div class='chapterindex" + key + "'>working</div>");
    $(".chapterindex" + key).load(value + " .content");     

    alert(this.href);

    $(".chapterindex" + key + " div.link a").each(function(intIndex) {
            alert(".chapterindex" + key);
        });
    });

If I take the first alert out of line 11 then the last alert doesn't fire. What am I doing wrong?

The delay that the alert is causing is allowing the data in your load call to load. I suspect that when you remove the alert the data does not load in time.

Try using a callback with your load call, something like (code not tested) -

$(".chapterindex" + key).load(value + " .content",function () {
        $(".chapterindex" + key + " div.link a").each(function(intIndex) {
            alert(".chapterindex" + key);
        });
});

The first alert is probably giving the load function enough time to finish so when you take it out the load function is not done when its trying to fire your second alert.