Question

I have a basic set-up like this:

<div class="stop">
    <span class="point"></span>
</div>
<div class="stop">
    <span class="point"></span>
</div>

and I would like to append the index of div.stop within the nested span.point of each, like this:

<div class="stop">
    <span class="point">1</span>
</div>
<div class="stop">
    <span class="point">2</span>
</div>

This is the jquery I’m using, but it’s not working:

$("div.stop").each(function() {
    var stopNumber = $("div.stop").index(this);
    $("div.stop span.point").append(stopNumber);
});

Thanks in advance for any tips or suggestions.

-Brian

Answer 1

There’s no need for the index call, .each supplies the index as a parameter to the callback:

$("div.stop").each(function(n) {
    $('span.point', this).append(n + 1);
});

See http://jsfiddle.net/55ABr/