I have 5 blank boxes, and I would like each of them to be filled up in order every 1 second. How do I do this? My JS is wrong and not working.

```js
let blankSquare = document.querySelectorAll(".square");

function fillUp() {
  setInterval(() => {
    blankSquare.classList.add(".fill")
  }, 1000)
}

blankSquare.addEventListener("fillUp");
```

```css
.square {
  margin: 1vh;
  height: 3vh;
  width: 3vh;
  background-color: none;
  border: solid 2px grey;
}

.fill {
  background-color: grey;
}
```

```html
<div class="squares">
  <div class="square"></div>
  <div class="square"></div>
  <div class="square"></div>
  <div class="square"></div>
  <div class="square"></div>
</div>
```