🎨 Peinture à classe

L’objectif de cet exercice est double :

1. Pratiquer la manipulation du DOM en JavaScript (sélection et modification d’éléments)
2. Utiliser des classes Bootstrap de couleur

Lorsque les étapes seront terminées, une image cachée se révèlera 🪄.

Indices

Cherchez querySelectorAll, forEach et innerText dans l'aide mémoire.

Qui sait, ça pourrait peut-être vous être utile 😜

Instructions

• Ouvrez le CodePen de départ : https://codepen.io/tim-momo/pen/YzodXex
• Cliquez sur Fork afin de créer votre propre copie du projet
• En JavaScript, sélectionnez tous les éléments qui ont les classes suivantes : .a, .b, .c et .d
• Placez chaque sélection dans une variable distincte (ex. : let classeA = ...;).
• À l’aide des variables créées, ajoutez une classe de couleur de fond Bootstrap :
  • Tous les .a doivent avoir une couleur de fond 🔵 bleue
  • Tous les .b doivent avoir une couleur de fond ⚫️ noire
  • Tous les .c doivent avoir une couleur de fond 🔴 rouge
  • Tous les .d doivent avoir une couleur de fond 🟡 jaune
• Une fois l'image révélée, le texte des cases est toujours visible ☹️. Il serait plus joli de les cacher ou de les retirer carrément. À faire en JavaScript !
• Présentez votre exploit à l'enseignant