Javascript for each loop only showing last object

Question

Could someone explain why my loop is only showing the last object of my array? Because I would like to output all the responses for my quiz Thank you!

var allQuestions = [
    {
      question: "Welk kerstnummer draai jij grijs tijdens de feestdagen?",
      responses: [{
        text: 'Feliz Navidad',
        value: 10
      },
      {
        text: 'Baby, Its Cold Outside',
        value: 6
      },

    var currentQuestion = 0;
    var question;
    var responses;

    var questions = document.getElementById("question");
    var quizForm = document.getElementById("choiceList");

    function showQuestion() {
      question = allQuestions[currentQuestion].question;
      // choice = allQuestions[answers].responses.length;

      questions.innerHTML = "<p>" + question + "</p>";

      for (var i = 0; i < allQuestions[currentQuestion].responses.length; i++) {
        responses = allQuestions[currentQuestion].responses[i].text;
        quizForm.innerHTML = "<li>" + responses + "</li>";
      }
    }

    showQuestion();

change to quizForm.innerHTML += "<li>" + responses + "</li>"; — zfrisch
– zfrisch, Commented Dec 3, 2018 at 20:20

eag845 · Accepted Answer · 2018-12-03 20:30:08Z

1

You could use quizForm.innerHTML += "<li>" + responses + "</li>"; but it's not efficient.

I woul prefer do this:

var liEl = document.createElement("li");
liEl.innerText = "someContent";
quizForm.appendChild(liEl);

let containerElement = document.getElementById("container");
let array = ['a','b','c']


for(let i = 0; i<array.length ; i++){
  containerElement.innerHTML += '<li>'+array[i]+'</li>';
}

array = ['x','y','z']

for(let i = 0; i<array.length ; i++){
  var liEl = document.createElement("li");
  liEl.innerText = array[i];
  containerElement.appendChild(liEl);
}

<ul id="container"></ul>

edited Dec 3, 2018 at 20:30

answered Dec 3, 2018 at 20:24

eag845

1,0131 gold badge12 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Javascript for each loop only showing last object

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related