JavaScript JavaScript Basics Making Decisions in Your Code with Conditional Statements The Conditional Challenge Solution

Score and rank appear on console.log but do not appear on page

I'm not familiar with html/javascript at all so I can't figure out why it's no displaying?

let score = 0
let rank =''

const main = document.querySelector('main');

answer1 = prompt ('How many eggs in a dozen');
if (+answer1 === 12) {
  score ++;
}
console.log(score);
answer2 = prompt ('What is the best food');
if (answer2 ==='Pizza' || answer2 === 'pizza') {
  score ++;
}
 console.log(score);                  
answer3 = prompt ('How many tacos can you eat?');
if (+answer3 > 6) {
  score++;
}

console.log(score);

answer4 = prompt ('Will you moo like a cow? Y or N');
if (answer4 ==='Y' || answer4 ==='y') {
  score ++;
}
console.log(score);

answer5 = prompt ('What color is red?');
  if (answer5 = 'red') {
    score++;
  }

console.log(score);


if (score >= 5) {
  rank='Gold';
}
else if (score >= 3) {
  rank='Silver';
}
else if (score >= 1) {
  rank = 'Bronze';
} else {
  rank = 'No crown';
}
console.log(rank);

main.innerHtml = `
<h2> You got ${score} out of 5 questions. </h2>
<p> You earned a ${rank} crown! </p>
  `;

3 Answers

Steven Parker
Steven Parker
207,981 Points

It's just a spelling issue. JavaScript is case-sensitive, and the name of the property that you want to assign to is "innerHTML" (last 4 letters all capital) instead of "innerHtml".

Fantastic. That was it!

I haven't worked in HTML since the days of GeoCitiies and Angelfire. Is there anything I could use to help complement this JS track?

non-existent!

Steven Parker
Steven Parker
207,981 Points

That might be an excellent complement to your JS studies. You'll be amazed at what can be done with modern CSS (including many things that previously could only be done in JS).