Javascript 遍历div，然后遍历其中的列表项

我有以下JS小提琴：

我试图循环浏览div，然后我试图循环浏览那些div中的列表项。所以我在想一个嵌套在for循环中的for循环。结果是在每个列表项中追加一个序列号

最终结果如下所示：

<div id="all-music" class="clearfix" data-equalizer="">
    <div id="mOption-1" class="medium-3 columns music-projects__project">
        <ul id="fileList-1" class="album-songs">
            <li data-audio="" class="album-songs__song">
                <span class="album-songs__number">
                    1   **NUMBER GOES HERE**
                </span>
                <span class="album-songs__title">
                    Up All Night
                </span>
            </li>

            <li data-audio="">
                <span class="album-songs__number">
                    2   **NUMBER GOES HERE**
                </span>
                <span class="album-songs__title">
                    Are You Hurting the One You Love?
                </span>
            </li>
        </ul>
    </div>

    <div id="mOption-2" class="medium-3 columns music-projects__project">
        <ul id="fileList-2" class="album-songs">
            <li data-audio="" class="album-songs__song">
                <span class="album-songs__number">
                    1   **NUMBER GOES HERE**
                </span>
                <span class="album-songs__title">
                    Up All Night
                </span>
            </li>

            <li data-audio="" class="album-songs__song">
                <span class="album-songs__number">
                    2   **NUMBER GOES HERE**
                </span>
                <span class="album-songs__title">
                    Ghosts (Demo)
                </span>
            </li>

            <li data-audio="">
                <span class="album-songs__number">
                    3   **NUMBER GOES HERE**
                </span>
                <span class="album-songs__title">
                    Are You Hurting the One You Love?
                </span>
            </li>
        </ul>
    </div>
</div>

var SongCounter = (function ($) {
    function init() {
        var albumLength = $('.album-songs').length;

        for (var i = 0; i < albumLength; i++) {
            // $('.album-songs li').eq(i).find('.album-songs__number').append(i + ' _ ');
            var songLength = $(this).eq(i).find('li').length;

            for (var z = 1; z < songLength; z++) {
                $(this).eq(z).find('.album-songs__number').append(z + ' _ ');
            }
        }
    }
    return {
        init: init
    };
})(jQuery);

SongCounter.init();

1**号码在这里**
彻夜未眠


2**号码在这里**
你在伤害你爱的人吗？




1**号码在这里**
彻夜未眠


2**号码在这里**
重影（演示）


3**号码在这里**
你在伤害你爱的人吗？

任何提示都将不胜感激

js如下所示：

<div id="all-music" class="clearfix" data-equalizer="">
    <div id="mOption-1" class="medium-3 columns music-projects__project">
        <ul id="fileList-1" class="album-songs">
            <li data-audio="" class="album-songs__song">
                <span class="album-songs__number">
                    1   **NUMBER GOES HERE**
                </span>
                <span class="album-songs__title">
                    Up All Night
                </span>
            </li>

            <li data-audio="">
                <span class="album-songs__number">
                    2   **NUMBER GOES HERE**
                </span>
                <span class="album-songs__title">
                    Are You Hurting the One You Love?
                </span>
            </li>
        </ul>
    </div>

    <div id="mOption-2" class="medium-3 columns music-projects__project">
        <ul id="fileList-2" class="album-songs">
            <li data-audio="" class="album-songs__song">
                <span class="album-songs__number">
                    1   **NUMBER GOES HERE**
                </span>
                <span class="album-songs__title">
                    Up All Night
                </span>
            </li>

            <li data-audio="" class="album-songs__song">
                <span class="album-songs__number">
                    2   **NUMBER GOES HERE**
                </span>
                <span class="album-songs__title">
                    Ghosts (Demo)
                </span>
            </li>

            <li data-audio="">
                <span class="album-songs__number">
                    3   **NUMBER GOES HERE**
                </span>
                <span class="album-songs__title">
                    Are You Hurting the One You Love?
                </span>
            </li>
        </ul>
    </div>
</div>

var SongCounter = (function ($) {
    function init() {
        var albumLength = $('.album-songs').length;

        for (var i = 0; i < albumLength; i++) {
            // $('.album-songs li').eq(i).find('.album-songs__number').append(i + ' _ ');
            var songLength = $(this).eq(i).find('li').length;

            for (var z = 1; z < songLength; z++) {
                $(this).eq(z).find('.album-songs__number').append(z + ' _ ');
            }
        }
    }
    return {
        init: init
    };
})(jQuery);

SongCounter.init();

var SongCounter=（函数（$）{
函数init（）{
var albumLength=$（'.album songs'）.length；
对于（变量i=0；i

jQuery的

index（）

get是父级中的元素索引，因此您真正需要的似乎是附加到跨度中的每个LI的索引

$('.album-songs__number').append(function() {
    return $(this).closest('li').index() + 1;
});

使用jQuery时：

$（'.album songs>li'）。每个（函数（）{
var index=$（'>li'，$（this.parent（））.index（this）+1；
$（'.album-songs_uuNumber'，this）.text（索引+“：”）；
});



**号码在这里**
彻夜未眠


**号码在这里**
你在伤害你爱的人吗？




**号码在这里**
彻夜未眠


**号码在这里**
重影（演示）


**号码在这里**
你在伤害你爱的人吗？


第一个循环中没有“$（this）”选择器的上下文：

“var songLength=$（this.eq（i）.find（'li'）.length；”

我有一把小提琴，你应该看看：


var SongCounter=（函数（$）{

})（jQuery）

SongCounter.init（）
 
这个
不是指DOM元素..你只是想这么做吗->@adeneo是的，这是我想做的100%，谈一谈三思。非常感谢。为什么使用“返回”这个，而不是这个？在您所做的事情中？我正在使用一个回调函数来调用
append（）
，该回调函数期望得到任何要追加的内容作为回报，在本例中是父级LI（+1）的索引。理解问题的能力非常棒。。感谢……；）