jQueryトラバーサルを使用してドームターゲットを選択する際に問題がある

Question

.help-blockのコンテンツをjQueryを使用して動的に更新しようとしていますが、なぜ私がターゲットできないのかわかりません.help-block私は単に$('.help-block').text(....を使用できますが、 find()またはnext()とfirst()のようなjQuery Traversingのメカニズムでこれを行う必要がありますが、そのうちのどれも仕事をしていませんでした。

$(function(){ 
 

 
    $(".dropdown-menu li a").click(function(){ 
 
     $("#selector").find('.help-block').html($(this).text()); 
 
     $("#selector").next('.help-block').html($(this).text()); 
 
     $("#selector").parent().find('.help-block').html($(this).text()); 
 
    }); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="col-md-6"> 
 
     <div class="form-group"> 
 
      <div class="col-md-12"> 
 
      <label class="control-label" for="new-cu-emailinput"></label> 
 
<div class="dropdown"> 
 
    <button class="btn btn-default dropdown-toggle" type="button" id="selector" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> 
 
    Please Select From the List<i class="fa fa-chevron-right pull-right" aria-hidden="true"></i></button> 
 
    <ul class="dropdown-menu" aria-labelledby="selector"> 
 
    <li><a href="#">Action</a></li> 
 
    <li><a href="#">Another action</a></li> 
 
    <li><a href="#">Something else here</a></li> 
 
    <li><a href="#">Separated link</a></li> 
 
    </ul> 
 
</div> 
 
      
 
<span class="help-block pull-right"></span> 
 
      </div> 
 
     </div> 
 
    
 
</div>

あなたは私が私が間違っているのか知っている聞かせていただけますか？

Answer 1

セレクタが間違っています。次のようにしてください。

$("#selector").closest('.dropdown').next('.help-block').html($(this).text());