Why is ".innerHTML" missing with my code

Question

My code was working perfectly before with the document.write.

Now that I have changed it to the "ID and innerHTML" my code isn't working the same. The only thing I changed was the function. Before each time my loop would run it would print an individual message for each answer and a current score.

But now the code only prints once with the total score and and doesn't run my "if" conditions until the very end of the prompts.

Why?

current code: https://w.trhou.se/hna6axe7om

original code with doc.write:

/Q&A game designed to ask three or more questions and track score./

//Vars and basic functions var qANDa = [ ['what is the first 1st of the alphabet?', 'a', ], ['what is the 2nd letter of the alphabet?', 'b',], ['what is the 3rd letter of the alphabet?', 'c',] ]; var q_a; var score=0;

function print(message) { document.write(message); }

// Game Q&A Engine function askQuestions (ask){ for (i=0; i<ask.length; i+=1){ q_a=prompt(ask[i][0]); q_a=q_a.toLowerCase();

    if (q_a===qANDa[i][1]){

score+=1; print('good boy! Your number of correct responses is ' + score + '. ');}

else { print('Bad Dog! Your number of correct responses is ' + score + '. '); } } }

//Activate the test. askQuestions(qANDa);

Answer 1 · 2019-09-27T16:13:31Z

September 27, 2019 4:13pm

With your original code you have individual document.write statements. Each writes a line to the document. With your current code you assign the message to innerHTML. Each still takes place but is 'overwritten' with the current assignment. Both are displayed after the loop due to browser behavior. This is a common question with the following video and is addressed in the video's teacher's notes.

If you wanted to print all three messages you could concatenate message in your loop as follows:

function askQuestions (ask){
   var message = ""
   for (i=0; i<ask.length; i+=1){
      q_a=prompt(ask[i][0]);
      q_a=q_a.toLowerCase();

      if (q_a===qANDa[i][1]){
         score+=1;
         message += '<p>good boy! Your number of correct responses is ' + score + '.</p><br>';
      }
      else {
         message += '<p>Bad Dog! Your number of correct responses is ' + score + '.</p><br>';
      }
    }

print(message)

}

Welcome to the Treehouse Community

Looking to learn something new?

Peter May

Peter May

Why is ".innerHTML" missing with my code

1 Answer

KRIS NIKOLAISEN

KRIS NIKOLAISEN

Peter May

Peter May