CODEWITHSUNDEEP
javascriptjqueryhtml
Supra
Supra

Reputation: 230

Jquery doesn't apply hide() to all of the divs with the same ID

I'm making a site, and the html is displayed through php with data fetched from a database. I have a foreach() function, so all of the things displayed have the same DIV ID's. It ends up being like 4 DIVs with the same ID (#content), so the PHP works fine, but I have a jQuery script and when I call the jQuery("#content").hide(); it only hides ONE of the DIV's not all of them, and I want it to hide all of them. Is there something else I have to do? Thanks.

Upvotes: 1

Views: 2462

Answers (4)

Dave Newton
Dave Newton

Reputation: 160201

You should use a class (.class_name), not an id--only one DOM element may have a given ID, otherwise it's invalid HTML. It's reasonable for an ID selector to return only a single element.

Upvotes: 6

Dave
Dave

Reputation: 11862

IDs on elements on a page should be unique. So every HTML tag you specify should have a different ID. If you want to hide all of a certain element, it might be suitable to add a class to the elements you wish to hide?

e.g.

<div class="divToHide">Content...</div>
<div class="divToHide">Content...</div>
<div class="divToHide">Content...</div>

Then your jquery would be:

$(".divToHide").hide();

Upvotes: 2

Yoram de Langen
Yoram de Langen

Reputation: 5499

an ID can only be used ONCE in HTML! because its a id and a id should always be Unique

Upvotes: 1

Jose Faeti
Jose Faeti

Reputation: 12294

That's simply because you cannot have more than one element with a specified ID. IDs are and must be unique. Only one single element with the same element may exist in a DOM.

Failing to follow this rule may result in broken scripts and other horrors.

You can use classes for this purpose.

Upvotes: 1

Related Questions