HTML Collection Length Is 0 Even After DOM Has Been Rendered

I am working on SSR React-based application using NextJS. Once DOM has been rendered I need to detect a set of elements visibility in the viewport and once they are visible I need

Solution 1:

As suggested in comment by epascarello

Because whatever is adding those elements is doing it after you read them. getElementsByClassName is a live Html Collection so as you add/remove things, it updates. That little [i] icon in the console is telling you it is updated

This is the right answer and solved my problem