when i press the up and down keys, i want the selected "div" element to change. How can i achieve this. pressing the down key on the keyboard, the selection needs to go to a bottom line.

```js
document.addEventListener("DOMContentLoaded", function(event) { // <-- add this wrapper
var element = document.querySelectorAll('.element');

    if (element) {

      element.forEach(function(el, key){

         el.addEventListener('click', function () {
            console.log(key);

            el.classList.toggle("active");

             element.forEach(function(ell, els){
                 if(key !== els) {
                     ell.classList.remove('active');
                 }
                  console.log(els);
             });
         });
      });
    }
});
```

```css
.element{
  background: gray;
  width:200px;
  padding:10px;
  margin-bottom:1px;
}

.element.active{
  background: red;
}
```

```html
<section>
  <div class="element">BOX</div>
  <div class="element">BOX</div>
  <div class="element">BOX</div>
  <div class="element">BOX</div>
  <div class="element">BOX</div>
  <div class="element">BOX</div>
</section>
```