Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript JavaScript Loops, Arrays and Objects Tracking Multiple Items with Arrays Build a Quiz Challenge, Part 2 Solution

Jennifer Hughes
Jennifer Hughes
11,421 Points

Why won't my list items appear correctly?

Although my array contains three items, only one appears on the screen in my printed list.

Any ideas?

var correctAnswers = 0;
var incorrectAnswers = 0;
var correctQuestions = [];
var incorrectQuestions = [];

function print(message) {
    document.getElementById('numberOfCorrectAnswers');
    numberOfCorrectAnswers.innerHTML = message;
}

function buildList(array) {
    var listHTML = '<ol>';
    for (var i = 0; i < array.length; i++) {
        listHTML = '<li>' + array[i] + '</li>';
    }
    listHTML += '</ol>';
    return listHTML;
}


questions = [
    ['How many states are in the United States?', 50],
    ['What is the oldest state?', 'delaware'],
    ['Who was the first presdient?', 'george washington']
]


for (var i = 0; i < questions.length; i++) {
    answer = prompt(questions[i][0]);
    if(answer.toString() === questions[i][1].toString()) {
        correctAnswers++;
        correctQuestions.push(questions[i][0]);
    }
    else {
        incorrectAnswers++;
        incorrectQuestions.push(questions[i][0]);
    }
}
console.log(correctQuestions);
message = 'You got ' + correctAnswers + ' question(s) right';
message += '<h2> You got these questions correct:</h2>';
message += buildList(correctQuestions);
message += '<h2> You got these questions incorrect:</h2>';
message += buildList(incorrectQuestions);

print(message);

2 Answers

Hey Jennifer,

In your print function, you have to either set a variable equal to the document.getElementById() statement or just combine the two:

function print(message) {
    var numberOfCorrectAnswers = document.getElementById('numberOfCorrectAnswers');
    numberOfCorrectAnswers.innerHTML += message;
}

Or

function print(message) {
    document.getElementById('numberOfCorrectAnswers').innerHTML += message;
}

Edit: modified to reflect changes below. Added += to function.

Oh, also you don't need to put the toString() method on your answer or questions since they're already strings.

Jennifer Hughes
Jennifer Hughes
11,421 Points

Hi Marcus,

Thanks for your help. Two things:

I put toString() because the answers could come in as numbers. When I leave toString() off, it does not register that 50 is the correct answer to the first question.

Secondly, it still is not working properly. If I answer all three questions correctly, it only prints one of the questions to the screen, the last question.

Any additional thoughts?

You need to have += in your print function. I didn't even think about that at first. I just knew the code would work lol. You don't have to put to string on your answer variable, however, because a prompt will always come in as a string. I would instead encapsulate the number 50 as a string, instead of calling toString(). It's much faster that way because you're not having to call methods to compare the data.

function print(message) {
    document.getElementById('numberOfCorrectAnswers').innerHTML += message;
}