选择与另一个元素匹配的每个元素以进行动态侧导航

Question

我想创建一个动态列表，可以更改div滚动上的活动元素。 为此，我有一个像这样的导航列表

<div class="liste-categorie">
    <ul id="top-menu">
        <li><a class="hover-3" href="#sashimis">Sashimis</a></li>
        <li><a class="hover-3" href="#Californiarolls">Californiarolls</a></li>
        <li><a class="hover-3" href="#Rainbowrolls">Rainbowrolls</a></li>
    </ul>
</div>

这是目标内容

<div class="col-md-9 wow zoomIn articles">
    <div class="container-fluid items">
        <div id="Sashimis" class="item"></div>
        <div id="Californiarolls" class="item"></div>
        <div id="Rainbowrolls" class="item"></div>
    </div>
</div>

那么我的滚动脚本在哪里

$(".articles").scroll(function() {
    var windscroll = $(".articles").scrollTop();
    if (windscroll >= 0) {
        $('.items .item').each(function(i,obj) {
            if ($(this).position().top <= windscroll && $(this).position().top + $(this).height() > windscroll) {
                $('#top-menu li.activate').removeClass('activate');
                $('#top-menu li').eq(i).addClass('activate');
            }
        });
    } else {
        $('#top-menu li.activate').removeClass('activate');
        $('#top-menu li').addClass('activate');
    }
}).scroll();

但它不起作用。我做错了什么 ？ ; _;