javascript - jQuery の最も近いクラス セレクター

Question

<div class="wrap">
    <div class="Level2">Click me</div>
    <div class="Level3">Information</div>
</div>

<div class="wrap">
    <div class="Level2">Click me</div>
    <div class="Level3">Information</div>
</div>

<div class="wrap">
    <div class="Level2">Click me</div>
    <div class="Level3">Information</div>
</div>

<div class="wrap">
    <div class="Level2">Click me</div>
    <div class="Level3">Information</div>
</div>

jQuery

$('.Level2').click(function(){
   $('.Level2').closest('.Level3').fadeToggle();
});

フェードインとフェードアウトに最も近い level3 を選択したかったのですが、うまくいきません。私の構文は間違っていますか？オンラインサンプル: http://jsfiddle.net/meEUZ/

Answer 1

.next()代わりに.closest()、DOM 要素の祖先をトラバースしてみてください。

ワーキングデモ

また、クリックしたものではなく$(this)すべて$('.Level2')を選択する代わりに使用する必要があります。.Level2

このようなこともできます - $(this).closest('.wrap').find('.Level3').fadeToggle();。

Answer 2

jQuery の.closest()メソッドは兄弟セレクターではなく、親を選択します。.siblings()メソッドを探しているようです。

$('.Level2').click(function(){
   $(this).siblings('.Level3').fadeToggle();
});

Answer 3

最も近いものは dom ツリーを上ります。兄弟であるものは見つかりません。親で検索を使用してこれを実現できます

$('.Level2').click(function(){
       $(this).parent().find('.Level3').fadeToggle();
    });