JavaScriptHTML + CSS + JavaScript

12345678

const answerButton = document.querySelector("#answer-button");
const answer = document.querySelector("#answer");

function toggleAnswer() {
  // TODO: Toggle the hidden class here.
}

answerButton.addEventListener("click", toggleAnswer);

const answerButton = document.querySelector("#answer-button");
const answer = document.querySelector("#answer");

function toggleAnswer() {
  // TODO: Toggle the hidden class here.
}

answerButton.addEventListener("click", toggleAnswer);

Draft saved locallyJavaScript · Spaces: 2

Live preview move your pointer inside

Mission 01 10 min

Reward+110 XP

Build an FAQ Toggle

Real websites often hide extra information until someone asks for it. You already know click events. Now reuse classList.toggle() to show and hide an FAQ answer.

Your mission

Make the FAQ button show the answer on the first click and hide it again on the next click.

Inside toggleAnswer(), toggle the hidden class on answer.
Keep the existing click listener.

Check FAQ Run project