将类添加到最近的ul

时间:2014-03-01 18:25:38

标签: javascript jquery html css

我正在尝试将一个类添加到以下< ul>对于包含字符串“Informationen”的h3元素。

这就是html输出现在的样子:

<h3>Informationen</h3>
<ul>
<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit</li>
<li>Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes</li>
<li>Donec quam felis, ultricies nec, pellentesque eu</li>
</ul>

我想实现的代码是这样的:

<h3>Informationen</h3>
<ul class"normal">
<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit</li>
<li>Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes</li>
<li>Donec quam felis, ultricies nec, pellentesque eu</li>
</ul>

我有几个不同字符串的h3元素,所以我用这个脚本抓住了正确的元素:

$('h3').each(function() {
    var $this = $(this);
    var text = $this.html();
    if (text == 'Informationen'){
    alert(text);
    };
});

现在,当找到带有此文本/字符串的元素时,警报会显示字符串“Informationen”。

现在要将一个类添加到最近/下一个ul我试过这个:

$('h3').each(function() {
    var $this = $(this);
    var text = $this.html();
    if (text == 'Informationen'){
    //alert(text);
    $this.closest('ul').addClass('normal');
    };
});

但这不起作用,就像下面的脚本也不起作用一样:

$('h3').each(function() {
    var $this = $(this);
    var text = $this.html();
    if (text == 'Informationen'){
    //alert(text);
    $(this).closest('ul').addClass('normal');
    };
});

这是一个小提琴:http://jsfiddle.net/JNtw2/1/

有人能指出我的解决方案吗?

3 个答案:

答案 0 :(得分:6)

closest()获取最匹配的父元素,您正在寻找next(),因为UL就在H3之后

$('h3').each(function() {
    var $this = $(this);
    var text = $this.html();
    if (text == 'Informationen'){

        $this.next('ul').addClass('normal');

    };
});

FIDDLE

答案 1 :(得分:2)

您需要使用next()方法而不是nearest()方法。

答案 2 :(得分:1)

我可以建议你这样做吗?

注意:这假定Informationen不会包含在另一个h3的句子中。

$('h3:contains(Informationen)').next().addClass('normal');

另请注意,如果您知道每个next代码后跟h3代码,则无需将某个扇区传递给ul