Suraj Roy Suraj Roy - 1 year ago 85
jQuery Question

Toggle visibility of all divs at once

i have multiple divs with id = e. also multiple divs with id = b. now i want to hide all divs with id e and show all divs with id b. this should be done using toggle. so that again clicking on button shows all divs with id e and hides all divs with id b.

function toggle_visibility(e, b) {
var e = document.getElementById(e);
var e2 = document.getElementById(b);
if( == 'none') { = 'inline-block'; //block will show the conain in div = 'none';
else { = 'none'; = 'inline-block';
border-style: solid;
border-color: black;
padding: 5px;
margin: 2px;
<a href="#id" onclick="toggle_visibility('e', 'b');">Change</a>

<div id="e" class="menu">Male</div><div id="b" class="menu" style="display: none;">পুরুষ</div>

<div id="e" class="menu">Female</div><div id="b" class="menu" style="display: none;">মহিলা</div>

Answer Source

id has to be unique...You can target multiple elements using having common class name like so:

     function toggle_visibility(e, b) {
       var e = $(".e");
       var e2 = $(".b");
       if (":visible")) {;
       } else {
<script src=""></script>
<a href="#id" onclick="toggle_visibility('e', 'b');">Change</a>

<div id="e" class="menu e">Male</div>
<div id="b" class="menu b" style="display: none;">পুরুষ</div>

<div id="e" class="menu e">Female</div>
<div id="b" class="menu b" style="display: none;">মহিলা</div>

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download