jQueryの子要素を取得するには？

Question

私はこのように定義されたHTMLコードを持っている：

<div class="modal fade" id="my_0" role="dialog"> 
    <!-- Rest removed for brevity --> 
</div> 

ポイントは、私は私のHTMLにこれをたくさん持っているということであり、私もその一人、modal fadeからmodal fade inへのアクティブな1のクラスの変更をクリックしたとき。そこで私はアクティブなモーダル要素の子をいくつか探したいと思っています。私は以下の両方のアプローチを試みましたが、どちらも未定義に戻ります。

$(function() { 
    $("#SubmitBtn").click(function() { 
     var location = $('.modal fade in').find("#location"); 
     var info = $('.modal fade in').children("#additional"); 

     alert("loc is: " + location.val()); 
     alert("info is: " + info.val()); 
    }); 
}); 

Answer 1

jqueryでは、cssと同じ要素を選択します。したがって、$('.modal fade in)の代わりに$('.modal.fade.in')にする必要があります。それを作る：

Codepen Example

$(function() { 
    $("#SubmitBtn").click(function() { 
     var location = $('.modal.fade').find("#location"); 
     var info = $('.modal.fade').children("#additional"); 

     alert("loc is: " + location.val()); 
     alert("info is: " + info.val()); 
    }); 
}); 

1つ注意 - 子供たちのために検索するときに、IDセレクタを使用しています。 idを使用する場合は、そのidを持つ要素が1つのみ存在する必要があります。それ以外の場合は、クラスを使用する必要があります。 IDを使用していて、必要なだけIDを持っている場合は、別の要素内で検索するのではなく、$('#additional')のように選択するだけです。