How do I show div when button is clicked?

Question

This is my CSS code. I want to set the display so that my text whats in the div shows up.

div.divi
{display: none}

This is my HTML code.

    <!doctype html>
<html lang="nl">
    <head>
        <title>Over informatica en ik</title>
        <meta charset="utf-8">
        <link rel="stylesheet" href="opmaak.css">
    </head>
    <body>
        <div class="divi">
        <p class="groot">Informatica</p>
        <p>hoi</p>
        </div>

<button type="button"
onclick="document.getElementByClass('divi').style.display ='block'">
</button>


    </body>

</html>

Answer 1

Simply replace <div class="divi"> with <div id="divi"> and the CSS with div#divi{display: none} .

Or if you would prefer to keep divi as a class instead of an ID, you can update your code to the following:

<div class="divi">
    <button id="div3">
      <p class="groot">Informatica</p>
      <p>hoi</p>
</div>

<button type="button" onclick="document.getElementsByClassName('divi')[0].style.display='block'">Text</button>

Answer 2

Try this:

 div.divi { display: none }

 <div class="divi"> <p class="groot">Informatica</p> <p>hoi</p> </div> <button type="button" onclick="document.getElementsByClassName('divi')[0].style.display ='block'; this.style.display = 'none';"> </button>

Tell me if it needs improvement :)

How do I show div when button is clicked?

Question

2 answers

solution1
0 2015-11-25 17:02:49

solution2
0 ACCPTED 2015-11-25 17:04:23

How do I show div when button is clicked?

Question

2 answers

solution1 0 2015-11-25 17:02:49

solution2 0 ACCPTED 2015-11-25 17:04:23

solution1
0 2015-11-25 17:02:49

solution2
0 ACCPTED 2015-11-25 17:04:23