How to hide multiple divs by their id and class using javascript

Question

I want to hide multiple divs id by using javascript .i am trying to have the 5 divs to be hidden on page load but can not seem to get it to work. I can use Javascript or JQuery.

Answer 1

You can use a common class for all the divs you want to hide, once you have got the divs you want hhidden, loop over the elements to hide them..

 function foo() { var divs = document.querySelectorAll('.hideMe'); divs.forEach((eachDiv) => { eachDiv.style.display = 'none'; //eachDiv.style.visibility = 'hidden'; }) }

 <div class="hideMe">One</div> <div class="hideMe">Two</div> <div class="hideMe">Three</div> <button onclick="foo()">Click Me!</button>

Answer 2

I think you mean to hide multiple div with different ids like this: (separate them with spaces)

$('#id1, #id2, #id3, #id4, #id5').hide()

But this is generally a bad solution. I suggest you to add a common class to them and just hide them when required:

$('.common-class').hide()