how to display a div triggered by onclick event

Question

I have have two divs. I want to display a div( which has other divs inside it ) when the onclick event is triggered.

Any help or suggestion would be appreciated.

Answer 1

Here you go:

div{
    display: none;
}

document.querySelector("button").addEventListener("click", function(){
    document.querySelector("div").style.display = "block";
});

<div>blah blah blah</div>
<button>Show</button>

LIVE DEMO: http://jsfiddle.net/DerekL/p78Qq/

Answer 2

You'll have to give an ID to the div you want to show/hide, then use this code:

html:

<div id="one">
    <div id="tow">
        This is text
    </div>
    <button onclick="javascript:showDiv();">Click to show div</button>
</div>

javascript:

function showDiv() {
    div = document.getElementById('tow');
    div.style.display = "block";
}

CSS:

​#tow { display: none; }​

Fiddle: http://jsfiddle.net/xkdNa/