Znajdowanie określonych elementów za pomocą jQuery

Question

Mam następujące oznaczenia.

<h6>Brand</h6> 

<ul> 
    <li>Orange</li> 
    <li>Black</li> 
    <li>Green</li> 
</ul> 

<h6>Colour</h6> 

<ul> 
    <li>Green</li> 
    <li>Blue</li> 
    <li>Black</li> 
    <li>Orange</li> 
</ul> 

Nie mogę zmienić lub fizycznie dodać do tego znacznika, dlatego próbuję manipulować przy pomocy jQuery.

To, co chcę osiągnąć, to zmienić słowo Black na Purple. Ale tylko słowo Black która pojawia się po H6 zawierającej „Kolor”

mam to do tej pory:

$("h6:contains('Colour'):.jqueryCheck:contains('Black')").html("Purple"); 

To jednak nie działa ... Dlaczego nie?

Answer 1

$("h6:contains('Colour')").next('ul').children("li:contains('Black')").html("Purple"); 

Albo cały ciąg jako jeden selektor:

$("h6:contains('Colour') + ul li:contains('Black')").html("Purple"); 

Answer 2

Spróbuj użyć adjacent selector:

$("h6:contains('Colour')+ ul li:contains('Black')").text('Purple'); 

Zobacz ten DEMO.

Answer 3

$('h6:contains("Colour")').next('ul').children('li:contains("Black")').text("Purple"); 

Fiddle

Answer 4

Można użyć coś takiego:

$("h6:contains('Colour')").next().find("li:contains('Black')").text('Purple');​ 

ten znajdzie odpowiednią <h6>, który zawiera "Colour", a następnie przechodzi do następnego elementu równorzędnego (który jest znacznikiem <ul>, a następnie wewnątrz tego <ul>, znajduje się <li>, który zawiera "Black" i zmienia ten tekst na "Purple".

Widać to działa tutaj: http://jsfiddle.net/jfriend00/rdSzC/