Événements sur plusieurs éléments

Objectif

Ajouter un événement à plusieurs éléments avec forEach.

Contexte

Pour ajouter un événement à plusieurs éléments, on combine querySelectorAll et forEach :

const boutons = document.querySelectorAll(".btn")

boutons.forEach(function(bouton) {
  bouton.addEventListener("click", function() {
    console.log("Bouton cliqué :", bouton.textContent)
  })
})

Pourquoi forEach ?

querySelectorAll retourne une liste d'éléments. On ne peut pas faire liste.addEventListener() directement. Il faut parcourir chaque élément.

Consigne

Ajoute un événement "click" à chaque bouton qui :

1. Affiche la couleur dans la console
2. Change la couleur de fond de #apercu

Teste en cliquant sur les boutons de couleur !