jQuery Children対セレクタの親要素として$（this）を持つシブリング

Question

私はリサイクルすることなく適切に処理するための単一の関数を構築しようとしているので、私のページにこれらの数十があると思われますコードを何度も繰り返し、要素のIDやクラス名を変更するだけで、この作業ができます。

私のHTMLは次のようになります。

<div class="button_select"> 
    <ul class="button_select_toggle"> 
     <li> 
      <div class="button_select_text">Menu Text</div><div class="button_select_arrow">V</div> 
     </li> 
    </ul> 
    <ul class="button_select_sub" rel="hidden"> 
     <li>Text</li> 
     <li>Text</li> 
     <li>Text</li> 
     <li>Text</li> 
    </ul> 
</div> 

そして、私は何をしようとしている現在、クラスと特異的にULを取得button_select_subので、私はその相対値を得ることができます。どのページでもこれが唯一のページになるとすれば、これはいくらか容易になるでしょうが、これは何度も何度も知っている任意のページにあるでしょう。それゆえ私はそれらを扱うための普遍的な機能を作りようとしています。とにかく私の最後の失敗しました：

var selectstatus = $(this).siblings('.button_select_sub').attr('rel'); 
alert('status: '+selectstatus); 

が、警告に、私は「状態：未定義は、」取得しています多分正しく兄弟を使用していないイム？多分代替の選択肢かもしれない。言及する価値があるのは、button_select_subがdiv内の最後のULであるとは限りませんので、私はできません。

iveも試してみましたが、子ども（）..と他の人、私は可能なことを知っています。

Answer 1

$(this)が「button_select」を参照している場合は、childrenではなくsiblingsを使用してください。

var selectstatus = $(this).children('.button_select_sub').attr('rel'); 
alert('status: '+selectstatus); 

Answer 2

これを試してください：あなたは、単一の.button_select_sub以上のものを持っている場合はそれがポップアップするアラートの数を引き起こすかもしれませんが

$(document).ready(function(){ 

    var selectstatus = ""; 

    $('.button_select').click(function(){ 

     selectstatus = $(this).children('ul.button_select_sub').attr('rel'); 
     alert('status: '+selectstatus); 
    }); 

}); 

あなたは、各ステートメントを実行したい場合があります。

Answer 3

$(this)が.button-selectを参照している場合は、siblingsは使用する必要がありません。 childrenまたはfindを使用する必要がありますが、children().find()はここでは意味がありません。 また、.button_select_subが多数ある場合は、eachを繰り返し、それぞれrelの値を抽出する必要があります。

$('.button_select') 
    .find('.button_select_sub') 
    .each(function(){ 
     alert($(this).attr('rel')); 
    });