• I started by creating all the files for the project: index.html, style,css, movietrivia.js, and README.md.

• I pseudocoded what I needed to do to make this code work.

• Then, I did some research and found some good trivia to add.

• I created the general layout of the html page and added the DOM elements to connect it to the JavaScript.

• Next, I started to add the CSS (the background colors for the answer buttons refused to work like I wanted).

• I then set global variables that I would need for the different aspects of the project: time, score, etc.

• I then got started on the functions, which was the hardest part by far:

  • Start button event
  • Start game (with many if else statements to hide elements on the page)
  • Setting and showing questions (broken)
  • Getting the right answers and checking if they were correct
  • Next button event
  • Clearing old answers
  • Countdown timer
  • Scoreboard (incomplete)

The main problems that I had were the score counter (which meant I was never able to get to the scoreboard) and the questions appearing.

When I first started, I was able to get the questions to appear by random and in the div that I designated (see image). But as soon as I tried to validate the answers and get the next button to work, the questions went away and I'm not sure how to undo what I did without the whole thing unraveling.

No matter what I tried for the score, it wouldn't work.