jquery的選擇子幾層深

Question

我有以下結構：

<div class="container questions"> 
     <div class="row"> 
      <div class="col-md-4"> 
       <span>Do you have any pets?</span> 
      </div> 
      <div class="col-md-4"> 
       <input type="text" class="form-control" /> 
      </div> 
     </div> 
    </div> 

在容器中的行產生的，我需要用於當輸入改變的監聽器。我曾嘗試：

$('.questions').children('div').children('div').children('input').change(function() { 
      alert('answered'); 
      Question_Answered(); 

    }); 

雖然選擇的這條道路似乎沒有工作，我也嘗試了幾種>子選擇。試圖在jQuery中使用這些東西讓我感覺很愚蠢。

Answer 1

這將正常工作，即使我們dynamcially增加投入div.questions

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
<script> 

$('.questions').on('change','input',function() { 
    alert('answered'); 
    Question_Answered(); 
}); 

</script>