JSFiddle - React, Tailwind, and code Playground

by Adrien Joly

HTML

<p>C'est l'histoire d'un garçon troublé</p>
<p class="spoiler">car il s'avère que son ours en peluche a disparu</p>
<p class="spoiler">mais finalement il le retrouve</p>

CSS

.hidden {
  background: gray;
  color: gray;
}

JavaScript

// 1. récupérer LES spoilerS
var spoilers = document.getElementsByClassName('spoiler');
for (var i = 0; i < spoilers.length; i++) {
  var spoiler = spoilers[i];
  // 2. camoufler CHAQUE spoiler
  spoiler.classList.add('hidden');
  // 3. afficher CHAQUE spoiler au clic
  spoiler.onclick = function() {
    spoiler.classList.remove('hidden');
  };
}