Question

I have a working concept of User clicks on image to display a div.

I use the javascript:void(0); and onclick="showElem('div40');" to open and close the divs

I have a jsFiddle here: http://jsfiddle.net/dillon/M4t5Q/

What I want is to only allow one div to be open at a time. So if one of the divs is open, it will close when another is clicked on.

I couldn’t figure out a solution by myself so I would love any help.

Answer 1

To hide all currently open DIVs, you can use:

// close all other DIVs with class 'show'
var currentlyShown = document.getElementsByClassName('show');
for(var i in currentlyShown) {
    currentlyShown[i].className = 'hide';
}

Demo: http://jsfiddle.net/M4t5Q/3/