Why does the console output undefined when accessing htmlcollection?

Question

JavaScript

Hello, the following problem arose:
With the help of getElementBeClassName I find a list with the class .goods-dots

const pagination1  = document.getElementsByClassName('goods-dots'); // Нахожу пагинацию

The console outputs this:



I'm trying to access the first element, the console outputs this:


But querySelectorAll doesn't work at all:


Link to the site -- lunamag-articles.malevich-web.ru/interview-cucu-be...
Here is the slider itself with pagination


I will be very happy if you help

Answer 1

All this needs to be added to the event handler, which will display information after the page has loaded.

$(window).on('load', () => {

})

Answer 2

document.querySelectorAll('.goods-dots');beautifully returns everything.
On account of , all getElementsBy* return HTMLCollections that are updated automatically when elements on the page change. document.getElementsByClassName('goods-dots');