使所有其他Divs消失javascript

Question

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?

Answer 1

Try this :

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

Can be improved by skiping in the first loop div which match your classes.

Answer 2

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

Answer 3

This is what I would try:

$("div").Hide();
$("." + foo).Show();