javascript - 特定の親の下で div を 1 つだけ選択する方法

Question

クラスが「検索可能」の div で検索を実行したいのですが、どのように選択すればよいかわかりません。以前のコードのようなものを試しましたが、うまくいきませんでした。

                $('#SEARCH').change(function () {
                //if (e.which == 13) {
                    var txt = $('#SEARCH').val();
                    $('.divin').each(function(){
                       if($(this + ' > .searchable').text().toUpperCase().indexOf(txt.toUpperCase()) == -1){
                           $(this).hide();
                       }
                    });
                //}
            });

($(this + ' > .searchable')は正しくありません

HTML:

<li id="listItem_156" class="divin">
<div style="width:30px;">
    <a href="#?w=800" rel="popup_name" id="156" class="poplight">
        <img height="16" style="cursor:move;" width="16" src="img/arrow.png" border="0"  />
    </a>
</div>
<div style="width:220px;" class="searchable">
    <a href="action=MemberDetails&item=156" class="body">Mike Frank </a> 
</div>
<div style="width:110px;">
    0 
</div>

Answer 1

使用するjQuery.find

if($(this).find(' >.searchable').text().toUpperCase().indexOf(txt.toUpperCase()) == -1){
      $(this).hide();
}

Answer 2

jsfiddleで

    $('#SEARCH').change(function () {
        var txt = $('#SEARCH').val();
        $('.divin .searchable').show().filter(function () {
              return $(this).text().toUpperCase().indexOf(txt.toUpperCase()) === -1
        }).hide();

    });

Answer 3

なぜ直接これをしないのですか

 $('.divin .searchable').each(function(){

したがって

 $('#SEARCH').change(function () {
                //if (e.which == 13) {
                    var txt = $('#SEARCH').val();
                    $('.divin .searchable').each(function(){
                       if($(this).text().toUpperCase().indexOf(txt.toUpperCase()) == -1){
                           $(this).parent().hide();
                       }
                    });
                //}
            });