How can I detect if a label has a specific class?

Question

I have a dropdown menu that contains checkboxes, and more than one can be checked at once. When a checkbox is selected, it's label's class is set to "checked" and then removed when it is deselected.

Before checkbox is selected:

<label><input type="checkbox" name="gainlosstypes[]" value="Losses" class="upperFilter">Losses</label>

After checkbox is selected:

<label class="checked"><input type="checkbox" name="gainlosstypes[]" value="Losses" class="upperFilte">Losses</label>

When it is selected the label element has .toggleClass('checked') called on it.

I need to be able to detect which label's have their class set to "checked" so that I can filter data based on those fields.

If $(this) is the label element, when I try $(this).hasClass('checked') it throws an error. That's the only way I know to try. Is there some other way to tell if a specific label element has a specific class?

Edit:

I get these errors when trying to check for the attribute. It also happens when I use hasClass:

> $(".multiSelectOptions :checkbox")[1].attr('checked')
TypeError: Object #<HTMLInputElement> has no method 'attr'
> $(".multiSelectOptions :checkbox").parent('label')[1].attr('checked')
TypeError: Object #<HTMLLabelElement> has no method 'attr'

This should help: http://stackoverflow.com/questions/1318076/jquery-hasattr-checking-to-see-if-there-is-an-attribute-on-an-element You can do `$('').attr('checked')` — Erik Christianson, Sep 13 '13 at 15:19
Show some code - are you setting an actual class on the label, or are you confusing `class` and `attribute`? A checkbox can have a `checked` _attribute_ — Bojangles, Sep 13 '13 at 15:20
Why do you use label with checkboxs? would it make more sense to use `` ???? — Sebastien, Sep 13 '13 at 15:35
Concerning your edit. Is `$(".multiSelectOptions :checkbox")` getting any results? — Erik Christianson, Sep 13 '13 at 15:40
Why not use just plain JQuery selector?? $('.checked') would work great ?? — Sebastien, Sep 13 '13 at 15:47
The problem is your use of `[1]` before `.attr()` or `.hasClass()`. That extracts the DOM element from the jQuery object, but these methods only operate on jQuery objects. — Barmar, Sep 13 '13 at 15:51
@Sebastien He wants to test if a specific element `$(this)` has the class, not find all the elements with the class. — Barmar, Sep 13 '13 at 15:51
And hasClass should work. I am starting to think the error might be somewhere else than at the .hasclass — Sebastien, Sep 13 '13 at 15:58

Sebastien · Accepted Answer · 2013-09-13T15:44:14.293

Checked is not a css class it is an html attribute. thus you should check for the attribute not the class.

You should try :

if($(this).attr('checked') != null)
{
    //do stuff here
}

EDIT:

Like @Bojangles said checked could be a custom CSS class but it would probably make more sense to check for checked checkbox with the attribute rather than a custom css class.

EDIT #2:

PLEASE SKIP PREVIOUS ANSWER AND USE THIS INSTEAD:

You could use the JQuery selector on this:

For exemple:

$('.checked')//this would get you all the element with the class 'checked'

//if you want to check if you have any check element:

if($('.checked').length > 0)
{
    //do stuff here
}

//To loop trought all the element that are 'checked'

$('.checked').each(
function(index)
{
    $(this).removeClass('checked');
    //do stuff here for exemple...
}
)

Ah yes, but it _can be_ a CSS class, hence everyone's confusion — Bojangles, Sep 13 '13 at 15:23
@Bojangles You are right it could be a CSS class but from what I saw in the question it look like the attribute not a custom CSS class. — Sebastien, Sep 13 '13 at 15:25

Brian Maupin · Answer 2 · 2013-09-13T15:30:46.310

-2

This will set checked if the label has the attribute 'checked' set, otherwise you'll get undefined and can base your logic off this.

var checked = $(this).attr('checked');

edited Sep 13 '13 at 15:30

answered Sep 13 '13 at 15:22

Brian Maupin

745
4
17

`var theSolutionYoureLookingFor = unExplainedFunction()` – Bojangles Sep 13 '13 at 15:23
Answers should contain **explanations**, not just a single line of code – Bojangles Sep 13 '13 at 15:24

score -2 · Answer 3 · answered Sep 13 '13 at 15:26

-2

How about

if( $(this).attr('class') == "checked" ){
    ... do something
}

That will check for the class of checked . . .

answered Sep 13 '13 at 15:26

Pat Dobson

3,249
2
19
32

How can I detect if a label has a specific class?

3 Answers3