Style Switcher

• In this exercise you will use JavaScript to change the styling and behavior of a number of divs on the page.
• Your job is to use the attached starter code to activate the below functionality.

Change Red:

• On click change the div below to a red background.
• You will want to reference the setAttribute method.

Change Green:

• On click change the div below to a green background.
• You will want to reference the setAttribute method.

Change Blue:

• On click change the div below to a blue background.
• You will want to reference the setAttribute method.

Make Big:

• On click make the div below larger and have a red background.
• You will want to reference the classList property

Make Small:

• On click make the div below smaller and have a green background.
• You will want to reference the classList property

Animate Div:

• On click perform an animation of your choice on the below div using CSS3.
• You will want to reference CSS3 transitions and transforms.

Bonus (Advanced) Create Full Screen Overlay:

• On click create a full screen overlay div that covers the entire screen with a transparent black color.
• On click of the overlay div, hide the overlay.