Search code examples
javascripthtmlshow-hide

Click on one Div and make all other Divs dissapear in Javascript


I got a Script Which makes me onclick showing all Divs with Specific id

This is the Selector

<a onclick="filterGal('simpleCart_shelfItem item Sonnenbrillen')" href="javascript:void(0);">Sonnenbrillen</a>

this is my Script

function filterGal(foo) {
                    var toHide = document.getElementsByClassName(foo);
                    for (i = 0; i < toHide.length; i++) {
                            toHide[i].style.display = 'block';
                    }
            }

So now my question how can i only show specific div with classname and display none the other div with other classnames? That these divs are going to be displayed nonen.


Solution

  • I just show you add jquery tag so you just need to do this :

    function filterGal(foo) {
        $( "div:not("+foo+")" ).hide();
    }
    

    Exemple : http://jsfiddle.net/ACjeZ/1