Modifying the Lite-Brite HTML

Tour the Existing Code

Look at the browser section (the lower portion of the page) - how many Lite-Brite “dots” are being displayed? Can you identify the code that created those dots?
While your cursor is on line 13, use the keyboard shortcut cmd + / (Mac) or ctrl + / (PC) to comment out that line of code. What changes do you see in the browser? What does that teach you about what line 13 does? (When finished exploring, uncomment line 13 with the same shortcut.)

Now that we're getting to know HTML and this specific project a bit better, let's modify it!

Add 5-10 additional dots to your Lite-Brite board.

Elements that live inside of the html body will be displayed on the page.
The number of elements and the content inside of the elements in the HTML body usually have a one-to-one correlation with what we see in the browser.
Every little character matters. The browser can’t assume anything about what we want it to do.