类的每个首次出现的 Jquery 选择器答案

【问题标题】：Jquery selector for each first appearance of a class类的每个首次出现的 Jquery 选择器
【发布时间】：2012-01-14 10:48:37
【问题描述】：

我有一个生成以下 HTML 代码的脚本：

<table class="table">
<tr><td class="head">Title</td></tr>
<tr><td class="cat">Featured</td></tr>
<tr><td class="cat">Hello</td></tr>
<tr><td class="cat">Hello</td></tr></table>

<table class="table">
<tr><td class="head">Title</td></tr>
<tr><td class="cat">Featured</td></tr>
<tr><td class="cat">Hello</td></tr>
<tr><td class="cat">Hello</td></tr></table>


<table class="table">
<tr><td class="head">Title</td></tr>
<tr><td class="cat">Featured</td></tr>
<tr><td class="cat">Hello</td></tr>
<tr><td class="cat">Hello</td></tr></table>

我需要设置第一个猫类“精选”的样式！我正在使用 jquery，但我不知道如何选择正确的选择器？

我试过了

jQuery(document).ready(function($){
    $(".table .cat:first").css("color","blue");
})

但我没有正确的工作，它只是选择第一个元素 class="cat"。

【问题讨论】：

标签： jquery jquery-selectors css-selectors

【解决方案1】：

改为：

$(".table").find(".cat:first").css("color","blue");

另见this example。

【讨论】：

【解决方案2】：

你需要像这样迭代表

jQuery(document).ready(function($){
    $('.table').each(function(){
        $(this).find('.cat:first').css('color', 'blue');
    })
})

这是小提琴 - http://jsfiddle.net/vFT46/

【讨论】：

非常感谢！你太客气了

【解决方案3】：

你可以使用这样的东西

$('.table').find('.cat:first').css('color','blue');

获取.table 的第一个.cat 孩子

DEMO

【讨论】：

【解决方案4】：

jQuery(document).ready(function($) {
     $(".table .head").next().css("color", "blue");
});

【讨论】：

@hutchbat -- 谢谢......如果它是正确的，你也应该接受另一张海报的答案;)