divobject.children() के अंदर नहीं आ रहा है ({'mousedown' ...});

Question

मैं माउस क्लिक पर एक div के अंदर किसी विशेष 'सेक्शन' के अंदर फोकस करने की कोशिश कर रहा हूं। मैंने कोड की निम्नलिखित पंक्तियां लिखी हैं:

$('#my-div-id').children('.my-section-class').on({ 
    'mousedown' : function(e){ 
     var $item = $(this); 
     $item.focus(); 
    }  
}); 

अनुभागों में कुछ के आधार पर div के अंदर लूप के अंदर अनुभाग जोड़े गए हैं।

div के अंदर 'my-section-class' वर्ग के पांच खंड हैं और $('#my-div-id').children('.my-section-class').length वापस लौट रहे हैं 5. लेकिन मेरे फ़ंक्शन के अंदर नियंत्रण कभी नहीं आता है।

उपरोक्त कोड में यदि मैं .children('.my-section-class') को अनदेखा कर रहा हूं, तो जब भी मैं div के अंदर क्लिक करता हूं तो नियंत्रण मेरे कार्य के अंदर जाता है। लेकिन मैं विशेष खंड पर ध्यान केंद्रित करना चाहता हूं, न कि संपूर्ण div।

मैंने $('#my-div-id').children('.my-section-class').live('click',function(event) भी कोशिश की है, लेकिन यह वही व्यवहार दे रहा है। अगर मैं children() फ़ंक्शन का उपयोग करने के बजाय किसी विशेष अनुभाग की आईडी को हार्ड कोड करता हूं तो मुझे अपने फ़ंक्शन के अंदर नियंत्रण मिल रहा है।

संपादित

html कोड एक <c:forEach> टैग का उपयोग कर जोड़ा गया है और इस <c:ForEach ...> <section class="my-section-class">...</section> </c:ForEach>

Answer 1

तरह लग रहा है की कोशिश करो

$('#my-div-id').on('mousedown', '.my-section-class', function(e) { 
    var $item = $(this); 
    $item.focus(); 
});