JQuery - Browse elements from a main div

Question

hi. i've a list of div linked to a main div-root. How can browse all elements of the main div? example :

<div id="main">
    <div class="trackon" id="trackline1">Line 1</div>
    <div class="trackon" id="trackline2">Line 2</div>
    <div class="trackon" id="trackline3">Line 3</div>
    <div class="trackoff" id="trackline4">Line 4</div>
    <div class="trackoff" id="trackline5">Line 5</div>
</div>

i'm looking for a jquery function that browse all elements (like a for each statament) of #main div. I've tried to search on official documentation but i find nothing! cheers

Answer 1

$('#main div').each(function(){
//$(this) is the current div
});

Or, if you want to make sure you just grab first level divs,

$('#main > div').each(function(){
//$(this) is the current div
});

Answer 2

$('#main>div').each(function(){
    alert($(this).attr('id'));
});

Answer 3

You can use the each like this:

$('$main > div').each(function(){
  // your code...
});

The > is child selector which is used here to select direct/immediate children of parent div.

Answer 4

$('#main').children().each(function(){
    alert($(this));
});

Answer 5

another (related) question : can i put somethings like this?

$('.tlcontent div>div.trackon>div.trackcounter').each(function(){
    $(this).html(idtl++);
});

tlcontent, trackon and trackcounter are each a class selector.

it looks like an error :)