jQuery each working on only first occurrence

Question

This is my code

$("#default-hidden").each(function(){
                    $(this).css("display", "none")
                });

its working on only the first occurrence of id=default-hidden, but it should be working on all. What am I doing wrong? TIA.

ID must be unique. Browser behavior for duplicated IDs is undefined. — Terry, Sep 13 '15 at 19:15
http://stackoverflow.com/questions/2031491/whats-the-difference-between-class-and-id-in-jquery — Jehanzeb.Malik, Sep 13 '15 at 19:35
http://stackoverflow.com/questions/12889362/difference-between-id-and-class-in-css-and-when-to-use-it — Jehanzeb.Malik, Sep 13 '15 at 19:35

Pranav C Balan · Answer 1 · 2015-09-14T02:50:15.587

Because id should be unique, you need to use class instead otherwise only first element get selected. Update id="default-hidden" to class="default-hidden"

$(".default-hidden").each(function(){
//-^-- class selector
    $(this).css("display", "none")
});

In your case there is no need for each() you can just use

$(".default-hidden").css("display", "none")

or you can hide them using hide()

$(".default-hidden").hide()

jQuery each working on only first occurrence

1 Answers1