Lab 9 - JavaScript for the Web

Challenge

In this lab, we are getting familiar with DOM manipulation.

Problems

While trying to append the new elements to my output <div>, I kept getting a TypeError that was saying outputEl was not a node and appendChild() asks for a node. It turns out I had put new1El and new2El in "" when it didn't need to be. I also wanted to make it so that when you hover over the div section, the background turns white and the text color turns black, but for some reason, the text wasn't changing colors. I ended up just changing the background color to a darker color and not touching the text color.

Results

I have a Lab 9 index.html file that is styled with CSS and I have a JavaScript file that creates new HTML elements.

Click to view images in a new tab! Image gallery code from w3schools.com.

Here is a screenshot of my HTML code.

Here is a screenshot of my CSS code.

Here is a screenshot of my JavaScript code.