jqueryを使用して子ノードからターゲット親ノード

Question

以下の構造を持っています。

<dl> 
    <dt class="tab">..</dt> 
    <dd class="tab-container">..</dd> 
    <dt class="tab"> 
     <div class="hi">hello</div> 
    </dt> 
    <dd class="tab-container">...</dd> 
    <dt class="tab">...</dt> 
    <dd class="tab-container">...</dd> 
</dl> 

"hi" divをクリックすると、最後のdd要素に新しいクラスを追加したいと思います。jqueryを使用して達成できますか？

Answer 1

トラバースを習得しようとします。あなたの質問に答えてください[コメントで尋ねた]

$(this).parents('dl').prev().closest('ul').children('li').eq(-2).addClass('new classs'); 

Answer 2

あなたは、関連するdd祖先を取得するためにclosest()として使用して、ターゲットにすることができ、最後のdl：

$('div.hi').on('click', function(){ 
    $(this).closest('dl').children('dd:last-child').addClass('myNewClass'); 
}); 

Answer 3

あなたはこのような何かしたいように聞こえる：

$(".hi").click(function() { 
    $(this).closest("dl").find("dd:last-child").addClass("blue"); 
}); 

例：https://jsfiddle.net/z24toqL2/

Answer 4

を1つの方法はjQuery.parentsを使用してが見つかるまでDOMツリーをトラバースすることです要素。ここで

$('.hi').on('click', function() { 
    $(this).parents('dl').find('dd:last').addClass('my-new-class'); 
}); 

は、DOMツリートラバーサルのためのjQuery API documentation categoryだ - それを行うには複数の方法があります。

Answer 5

こんにちは:)親（）または親（） - documentation for parents()を使用できます。

だから、これを試してみてください。

$('.hi').on('click', function() { 
    // In that case- parents('dl') - try to catch a dl parent 
    $(this).parents('dl').find('dd:last-of-type').addClass('new-class'); 
}); 

あなたがview online here in jsfiddleことができます。