永无止境的循环JavaScript

Question

Why is this loop never-ending? Every section may or may not have subsections, which are the same class as a section.The for statement is working very strangely. It goes straight back up to list.append('<label class="heading">' + theSection.description + '</label><br/><hr><br/>'); all the time. If there are no subsections it should not do that.

function createAssessmentSectionFormHTML(section) {
    var list = $('#assessmentSectionForm' + platform);
     appendSection(section, list);
}

function appendSection(theSection, list) {
    list.append('<label class="heading">' + theSection.description + '</label><br/><hr><br/>');
    appendSectionQuestions(theSection, list);
    if (theSection.allSubSections) {
        for (x = 0; x < theSection.allSubSections.length; x++) {
            var theSectionA = theSection.allSubSections[x];
            appendSection(theSectionA, list);
        }
        return;
    }
}

Answer 1

I believe you are missing a "var" in your for loop:

for (var x = 0; x < theSection.allSubSections.length; x++) {

This should solve the problem - it's running infinitely because x is not declared. Undefined is always less than any length, so there's no end point.