Блог

У меня есть этот HTML-код:

     <span id="one">one</span>
    <div>
        <span>two</span>
    </div>


  <span id="click">click</span>


$("#click").click(function(){
    $(this).css('color', 'red');
})
  

Я хотел бы иметь возможность изменять цвет

 <span>two</span>
  

когда я нажимаю «щелчок», но без добавления какого-либо пользовательского CSS-класса или атрибута id с помощью jQuery.

В точном случае, который вы описываете, вы можете раскрасить этот интервал с помощью этого селектора:

 $('#one').next('div').find('span').css('color','red');
  

Или, как указал pimvdb:

 $('#one   div span').css('color','red');
  

делает то же next() самое, что и, и это также устраняет необходимость использования .find() .

 $("#click").click(function(){
    $("div>span").css('color', 'red');
});
  

http://jsfiddle.net/rwddN/2/

или

вы можете использовать :contains

 $("#click").click(function(){
    $("span:contains(two)").css('color', 'red');
});
  

http://jsfiddle.net/rwddN/12/

Если ваш HTML-код точно такой, как показано в вопросе, вы можете сделать это:

 $("#click").click(function(){
    $("#one").next().find("span").css("color", "red");
});
  

Вот рабочий пример. Это работает путем получения span с id помощью «one», затем получения next элемента (который является div ) и, наконец, нахождения span внутри него div .