a button do thing on clicking & undo it on another click

Question

How can I make a button that when I click on it something appears, and when I click on it again that thing disappears, and this act keeps repeating on clicking.
For example, let's say I have a heading (h1), and when I click on it, a topic related to it appears(<div> or <p>), and when I click on the heading again that topic disappears

Answer 1

you can do this with if else statements in javascript.

el.on(‘click’, () => {
if (el.style.display === “none”)
el.style.display = “block”;
else
el.style.display = “none”;
});

Answer 2

In a div create h1 (heading) and a p (for message).

Now create a new class in css
.classname{
display :none; only
}
On h1 add a click event function

In fxn access p let's var para
Then
Para.classList.toggle("classname") ;

Hope it will work

Answer 3

Brian R
Thank you so much♥️
That's so easy, I don't know how I didn't think about it.. I have to fix my brain so that it thinks well😂

Answer 4

👍👍

Answer 5

Brian R if el is display none how one can click on it to make it display block???
Your click event is on the same element.

does it work??

Answer 6

Divya Mohan He just made a mistake, we can change the variable of the other element to another one.. it's about the idea not the details😊