How do I fix a dropdown button (HTML)

May 16, 2022

Whenever I try to change the things in this code, I’m only changing the button and function parts, but either nothing shows, or the button dosent work, when I click the button, it should show motivational comments, for a website I’m making, here’s the code:

function myFunction() {
  button.onclick = myFunction;

  document.getElementById("mot").style.visibility = "visible";
}

<button onclick="myFunction()" style="visibility:visible;">Motivation</button>

<body id="mot" style="visibility:hidden;">
  <p>It's harder too read code, then it is too write code</p>
  <p>Practice makes better, not perfect</p>
  <p>Good things take time, the better, the longer</p>

>Solution :

Your body element should contain all of your markup, not just some of it. Also, your body wasn’t being closed.
I’ve used a div to hold your comments
button.onclick = myFunction; wouldn’t work as button is undefined. You also are trying to add an event handler inside an already existing event handler.

function myFunction() 
{
  document.getElementById("mot").style.visibility = "visible";
}

<button onclick="myFunction()" style="visibility:visible;">Motivation</button>

<div id="mot" style="visibility:hidden;">
  <p>It's harder to read code than it is to write code</p>
  <p>Practice makes better, not perfect</p>
  <p>Good things take time, the better, the longer</p>
  
</div>