如何检查元素在元素父级中的相同ID是否滚动到顶部？

Question

我有：

<ul>
  <li class="test"><h1>One</h1><a id="stt">abc</a></li>
  <li class="test"><h1>Two</h1><a id="stt">abc 2</a></li>
  <li class="test"><h1>Three</h1><a id="stt">abc 3</a></li>
  <li class="test"><h1>Four</h1><a id="stt">abc 4</a></li>
</ul>

现在，我希望当每个测试类滚动到顶部时，将stt id的文本更改为已查看。 我怎样才能做到这一点？ 我试图使用：

$(window).scroll(function() {
           var scrollTop = $(this).scrollTop();
            var elements = document.getElementsByClassName('test');
            for (var i = elements.length - 1; i >= 0; i--) {
                //i can't change text off stt id in here
            }
        });