how to hide all divs in jquery

Question

I have several divs:

<div id="div-1"></div>
<div id="div-2"></div>
<div id="div-3"></div>
<div id="div-4"></div>

How can I hide them all with jquery. I used $('#div').hide(); and did not work.

Answer 1

You are using an id in your selector. Simply use:

$('div').hide();

However that will hide literally all divs. How about you hide only divs that have an id in the form of div-x ?

$('div[id^="div-"]').hide();

This will only hide the divs you mentioned without hiding other divs (which might be problematic).

Answer 2

for more detail you can read this : Element Selector (“element”)

this will do : $('div').hide();

there is no need of # sign which is for the id selector for jquery , if you want to hide element just write the name of element will do your task thats called as "element selector".

Answer 3

Take out the hash and just do $('div').hide(); because right now you are hiding all elements with an id of "div"

Answer 4

The problem is you are specifying an id in your selector. Use this instead:

$('div').hide();

Answer 5

jQuery uses CSS-selectors, so this hides all divs:

$('div').hide();

However, if you want to hide the divs whose id begins with "div", as in your example, do this:

$('div[id^="div"]').hide();

Answer 6

Assign a class to all the divs you want to hide and then do sth like

 $('.hider').hide()

This would hide all the divs with that class hider. Then you can do whatever you want on some of the divs

Answer 7

$('div').hide(); should work

$('#div') looks for id="div" rather than looking for all divs.

Answer 8

$('#div').hide();

does not work because you are lookin for something with ID = "div" and you have set your id's to "div-1" etc.

Instead try

  $('#div-1').hide();
  $('#div-2').hide();

etc

That will hide the specific div's mentioned.

If you really want to hide all the divs on your page then

  $('div').hide();

Answer 9

#div the element who's id is div , if you want to hide every div on the page then the selector that you want is just div (use $('div').hide() ).

I don't think that is what you really want though, you almost certainly do not actually want to hide every div on the page. You seem to be trying to hide several specific div s in one go. The way to do that is to separate the id 's with a comma: $('#div-1,#div-2,#div-3,#div-4').hide() .

Alternately a better way to do it is to add a class to those div s in case you want to change the number of div s.

So to hide:

<div id="div-1" class="foo"></div>
<div id="div-2" class="foo"></div>
<div id="div-3" class="foo"></div>
<div id="div-4" class="foo"></div>

You would use $('.foo').hide() .