Selecting all checked checkboxes with jquery

Hi

I am trying to select all the checked on a page with jquery :checked selector but I am having problems with it.

I have a tab on website and within 2 of these tabs I have separate check boxes. So what I did was on all input checkboxes I put a class on them. So for tab one all those checkboxes would have say a css class called "tab1" and the second tab checkboxes would have "tab2".

I was then planning to do this:

$('.tab1 :checked");

To find all the checkboxes in tab one that are checked but this never finds anything.

However Some of the checkboxes I have get rendered on server side since the user might already have information in the database. So these seem to get rendered something like this

<span class="tab1">
<input id="id" type="checkbox" name="name"/>
</span>

So when I do the above jquery on it I get all the checked boxes that are checked. It is just when I add the input boxes through jquery without this span tags around it I can't find any of the checked checkboxes. So I guess I could wrap all of them around with span tags but I just want to know why this is happening in the first place?

Thanks

I do not understand what you are trying to say.

Sounds like to me you hae <input type="checkbox" class="tab1" /> and you are wondering why that selector does not work.

Your selector is saying look for an element that is checked whose parent has a class.

If you want to do it so it is not looking at a parent you do not need a space

$(".tab1:checked")

You can also do it like this:

$("input.tab1[@type=radio][@checked]")

Eric

Eric Pascarello wrote:I do not understand what you are trying to say.

Sounds like to me you hae &amp;lt;input type=&quot;checkbox&quot; class=&quot;tab1&quot; /&amp;gt; and you are wondering why that selector does not work.

Your selector is saying look for an element that is checked whose parent has a class.

If you want to do it so it is not looking at a parent you do not need a space

$(&quot;.tab1:checked&quot;)

You can also do it like this:

$(&quot;input.tab1[@type=radio][@checked]&quot;)

Eric

Ya I am just wondering why it did not find any of the checked checkboxes.

I think I tried it without a space and it still did not work for me. It only worked for me when I had a &lt;span&gt; tag around my input checkbox and the span tag had the class selector.

So I was wondering why this is the case?

Also how would I find all unchecked checkboxes?

Edit

Never mind about the unchecked I figured it out(forgot about the not operator)

Michael Hubele wrote:So I was wondering why this is the case?

It's very straight-forward. Your selector searches for checked items inside a container with a specific class. If they're not in such a container, the selector will not match it. Simple.

I don;t understand why you feel that it should.

Bear Bibeault wrote:

Michael Hubele wrote:So I was wondering why this is the case?

It's very straight-forward. Your selector searches for checked items inside a container with a specific class. If they're not in such a container, the selector will not match it. Simple.

I don;t understand why you feel that it should.

Well if I had the class in the actual checkbox would that not be the container? I thought it would search for everything with that class in it evaluate it and see that it is checked.

That's not what your selector says.

It says: "find all checked elements that are children of an element with class tab1".

For a selector that says "find all checked elements that have the class tab1";, no space:

$(".tab1:checked")

The space is an &quot;operator&quot; that connotes containment. That's basic CSS -- nothing jQuery-specific.