jQuery hide all elements with the same id

Question

by topic I have some divs with id = \"loader\".

In my jQuery code I have

  $(\"#loader\").hide(),

but it works only with the first

Answer 1

The ids of html elements should be unique so you better use class with all element and use class selector to hide them all.

$('.className').hide();

If it is not possible for you to assign common class to them for instance you can not change the source code you can use Attribute Equals Selector [name=”value”].

 $("[id=loader]").hide();

Answer 2

Having more than one element with the same ID is not valid HTML. You can only have one element with the ID (#loader) in the whole page. That's why jQuery is hiding only the first element. Use the class instead of the id:

$('.loader').hide();

Answer 3

A way to hide all items of the same ID was as follows

$( "#hide" ).click(function() {
  $('div#hidden').hide();
});

<div id="hidden">ID Number 1</div>
<div id="2">ID Number 2</div>
<div id="hidden">ID Number 1</div>
<div id="2">ID Number 2</div>
<div id="hidden">ID Number 1</div>
<a href="#" id="hide">Hide Div</a>

Hope you can find this helpful.