Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

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

Posted by Meli N.H.
Meli N.H.
Courses Plus Student 1,656 Points

Why won't my <li> tags print?

function print(message) {
  var outputDiv = document.getElementById("output");
  output.innerHTML = message;
}

var questions = [
  ['How many states are in the United States?', 50],
  ['How many continents are there?', 7],
  ['How many legs does an insect have?', 6]
];

var correctAnswers = 0;
var correct = [];
var incorrect = [];
var question;
var answer; 
var response;
var html;
;

function buildList(arr) {
  var listHTML ='<ol>';
  for(m = 0; m < arr ; m+= 1 ) {
    listHTML+= '<li>' + arr[m] + '</li>';
  }
  listHTML += '</ol>';
  return listHTML;
}


for (var i = 0; i < questions.length; i += 1) {
  question = questions[i][0];  
  answer = questions[i][1];
  response = prompt(question);
  response = parseInt(response);
  if (response === answer) {
    correctAnswers += 1;
    correct.push(questions);
  } else {
    incorrect.push(questions);
  }
}
html = "You got " + correctAnswers + " question(s) right.";
html+= "<h2> You got there questions correct:</h2>";
html+= buildList(correct);
html+= "<h2>You got these questions wrong:</h2>";
html+= buildList(incorrect);
print(html);
Gabbie Metheny
Gabbie Metheny
33,778 Points
Gabbie Metheny
Gabbie Metheny
33,778 Points

It's hard to tell without seeing the html, too, but I noticed you have an extra semicolon on a line by itself, below your variable declarations and before your buildList function. Try removing that and see if anything changes!

1 Answer

Osaro Igbinovia
.a{fill-rule:evenodd;}techdegree
Osaro Igbinovia
Full Stack JavaScript Techdegree Student 15,928 Points

Hi Meli, so I've reviewed your code and you made some little syntax errors here and there. I'll point all of them out for you:

  1. In your print() function, you set the innerHTML of a different variable from the one you initially declared, 'outputDiv' and 'output'. There must be constancy in your code, so choose one variable name and stick to it.

    var outputDiv = document.getElementById("output");
output.innerHTML = message;

  2. After declaring the 'html' variable, you typed an extra semi-colon on the next line. Delete it.

    var html;
;

  3. In your buildList() function when constructing your for loop, you didn't add the length property to the given array(arr) you set as a parameter in the function. It should be arr.length.

    for(m = 0; m < arr ; m+= 1 ) {
listHTML+= '<li>' + arr[m] + '</li>';
}

  4. In the conditional statement in your second 'for' loop, when you were using the 'push' method to add questions to the correct and incorrect arrays. It should be 'question' you add in the arrays(which you defined in the loop) not 'questions'.

    if (response === answer) {
correctAnswers += 1;
correct.push(questions);
} else {
incorrect.push(questions);
}
Meli N.H.
Meli N.H.
Courses Plus Student 1,656 Points

I added the length property to my array and it worked! Thank you for taking the time to review my code :).