Stoplight Exercise

As always, fork and clone this repo. Submit a Pull Request when you are done.

Stoplight

Challenge One: Button Click

Wire up the buttons to the left of the stoplight so that when clicked, the corresponding bulb will turn on and any others will turn off.

Challenge Two: Button Toggle

Alter you event listeners to toggle the on/off state of each bulb. All three lights can be on or off for this challenge.

Challenge Three: Hover/Group Handler

A) Keep your existing code, but add new event listeners on each of your buttons that log "Entered [textContent] button" when a user mouses over a button.

B) Add new event listeners on each of your buttons that log "Left [textContent] button" when a user mouses out.

C) Add a single event listener on all three buttons as a group. In your group event handler, log the textContent of each button when a user clicks the button.

Hints

• Retrieve a DOMElement with document.querySelector or similar method
• Attach event listeners with addEventListener
• Set the color of a bulb with background-color
• Explore the various options of MouseEvent