View Full Version : Resolved Unhiding specific div when pressing button

08-01-2012, 09:12 PM
I'm trying to set up a group of buttons which will each unhide a certain div, while hiding the rest of the divs in a set. This is what I have, but it doesn't work:

.hidden {display:none;}
<script type="text/javascript">
function hideDivs()
divName="div" + i;

function unhide(selectedDiv)

<button class="menuButton" onClick="hideDivs();unhide('div2');">test div 2</button>
<button class="menuButton" onClick="hideDivs();unhide('div3');">test div 3</button>
<button class="menuButton" onClick="hideDivs();unhide('div4');">test div 4</button>

<div name="div1" class="hidden">DIV 1</div>
<div name="div2" class="hidden">DIV 2</div>
<div name="div3" class="hidden">DIV 3</div>
<div name="div4" class="hidden">DIV 4</div>
<div name="div5" class="hidden">DIV 5</div>

Can someone give me an idea of what I'm doing wrong?

Thanks in advance...

Philip M
08-01-2012, 10:06 PM
You have assigned names to your divs, but not ids. display property is "none" not hidden. You are mixing Javascript and CSS which is often a problem. There is no need for two functions.

<script type="text/javascript">

function hideDivs(selectedDiv) {
for (var i=1; i<=5; i++) {
divName="div" + i;
document.getElementById(divName).style.display="none"; // hide all divs
document.getElementById(selectedDiv).style.display='block'; // show the selected div

<button class="menuButton" onclick="hideDivs('div2')">test div 2</button>
<button class="menuButton" onclick="hideDivs('div3')">test div 3</button>
<button class="menuButton" onclick="hideDivs('div4');">test div 4</button>

<div id="div1" style="display:none">DIV 1</div>
<div id="div2" style="display:none">DIV 2</div>
<div id="div3" style="display:none">DIV 3</div>
<div id="div4" style="display:none">DIV 4</div>
<div id="div5" style="display:none">DIV 5</div>

"Knowledge is of no value unless you put it into practice.” - Anton Chekhov (Russian playwright and master of the modern short story, 1860-1904)

08-02-2012, 02:46 AM
That did the trick, thanks!