"use strict" document.addEventListener("DOMContentLoaded", () => { const forms = document.querySelectorAll("form"); forms.forEach((form) => { form.style.display = "none"; }); // add element to the DOM in the forms-container div const formsContainer = document.querySelector("#forms-container"); const noChosenForm = document.createElement("span"); noChosenForm.classList.add("error"); noChosenForm.textContent = "No form chosen"; formsContainer.appendChild(noChosenForm); }); document.querySelectorAll(".show-form").forEach((button) => { button.addEventListener("click", (event) => { showForm(event.target.dataset.formId); }); }); function showForm(formId) { const forms = document.querySelectorAll("#forms-container form"); forms.forEach((form) => { if (form.id === formId) { form.style.display = "block"; const noChosenForm = document.querySelector(".error"); noChosenForm.style.display = "none"; } else { form.style.display = "none"; } }); }