# Shake, Rattle and Roll Lab

# Introduction

One of the most common things to do with JavaScript is HTML Manipulation or changing HTML after it has been loaded.

# Objective

In this lab, you will use what you have learned about JavaScript variables and HTML Manipulation to make the box Shake, Rattle, and Roll.

# Requirements

Follow the requirements below to successfully complete the assignment.

1. Download the Shake, Rattle and Roll starter files. Inside the zip file you will find the following files: index.html, style.css and index.js. All of the changes will be made to the index.js file. Do NOT change the index.html or style.css files.
2. Retrieve the first box by using its id.
3. Add the classes shake, animated, and infinite to the first box.
4. Add the text "Shake" to the first box.
5. Retrieve the second box by using the class rattle.
6. Remove the class rattle from the second box.
7. Add the class wobble to the second box.
8. Update the text of the second box to "Wobble".
9. Retrieve the third box (NOTE: You will not be able to use a class).
10. Add the class rollIn to the third box.
11. Add the text "Roll" to the third box.
12. Retrieve the four box using the data-animation attribute.
13. Add a class to the four box with the same value as the data-animation attribute. Do NOT "hard code" the string.
14. Retrieve the five box, then choose your own animation and make the box animate forever (See Animate.css).
15. Once completed, submit the index.js file to Shake, Rattle and Roll assignment on Brightspace.