HTML/CSS/JavaScript only random colored boxes play/stop animation

This is supposed to be on an exam, and i would really like to learn it but just couldn't find a way how. It should be done using only HTML / CSS and JavaScript. So the main task is:

We have 6 separate div's stacked in a row horizontally and 2 buttons under those div's ( Play & Stop buttons ) when you click the play button an animation starts playing. The animation is - the first "box" is colored by a random color, then the next "box" is again colored by a random color, while the color on the first box disappears, and so on until all the boxes were colored once and it just starts over again. When you click the Stop button, the animation pauses and continues again when pressed play.