.find is not working

Question

hi this is my problem im currently looping all the selected element using jquery selector and tried to use .find(Selector) of jquery but i think its not working or is it possible to find an element using this code

 for (var i = 0; i < $('.MainElement').find('.ItemGroup').length; i++) {
            var CurrentSelectedGroup = $('.MainElement').find('.ItemGroup')[i].find('span');
            }

I debugged this code and its returning a unavailable but when i tried to jquery select the element manually its working is it possible to do this??

i need to select the span inside the current element inside the loop

I have searched in google i didnt find any

Answer 1

Though eq() as given below works, a better approach will be is to use .each() for iteration, as you are running your selector multiple times in your script

$('.MainElement').find('.ItemGroup').each(function(){
    var CurrentSelectedGroup = $(this).find('span');
})

or at the least cache the value of your selector and then reuse it in your loop

Answer 2

Try this as it's much cleaner:

$('.MainElement').find('.ItemGroup').each(function() {
    var CurrentSelectedGroup = $(this).find('span');
});

Answer 3

use eq()

var CurrentSelectedGroup = $('.MainElement').find('.ItemGroup').eq(i).find('span');

NOTE: $('.MainElement').find('.ItemGroup')[i] will return javascript object not jquery