如何使用jQuery对选择器的结果进行迭代

Question

i've some checkbox and i want to change background color of them when are selected more than one checkbox. I'm trying from this way:

var checked = $("input[@type=checkbox]:checked");
$('tr[name="' + checked.attr('name') + '"]').each(function() {
                        $(this).css('background-color', '#0000DD');
                    });

only the first selected changes is color and the other selected no, can you help me? does selector give in output only the first?

SOLVED IN THIS WAY:

$("input[type=checkbox]:checked").parents('tr').css('background-color', '#0000DD');

Answer 1

jQuery is not XPath. Omit the @ . Also, the .css method applies the style to all elements ib the collection, so you can omit .each .

var checked = $("input[type=checkbox]:checked");
$('tr[name="' + checked.attr('name') + '"]').css('background-color', '#0000DD');

Edit: I think that you misunderstand the method logic.
If you want to change the style of the container <tr> element, you have to loop through every element in the checkbox collection, and run some code on it:

$("input[type=checkbox]:checked").each(function() {
    $(this).closest('tr').css('background-color', '#0000DD');
});

Answer 2

.attr will only return the attribute of the first matched element. You have to traverse the result of the first selector (and also select the attribute without an @):

var checked = $("input[type=checkbox]:checked").each(function() {
    $('tr[name="' + $(this).attr('name') + '"]').css('background-color', '#0000DD');
});

Answer 3

Replace [@type=checkbox] by [type=checkbox] or just ':checkbox`. Try this.

$("input:checkbox:checked").each(function(){
     $('tr[name="' + this.name + '"]').each(function() {
          $(this).css('background-color', '#0000DD');
     });
});