I am trying to add an EventListener to my window object and toggle an active class when scrolling. But the event is never fired, what could be the problem?

 window.addEventListener('scroll', () => {
  let current = '';

  section.forEach(section => {
    const sectionTop = section.offsetTop;
    const sectionHeight = section.clientHeight;
    if (pageYOffset >= sectionTop) {
      current = section.getAttribute('id');
    }
  });

  navli.forEach(li => {
    li.classList.remove('active');
    if (li.classList.contains(current)) {
      li.classList.add('active');
    }
  });
});

Below is the HTML code

   <nav>
        <div class="navigation">
            <ul>
                <li class="home active"><a href="#home">Home</a></li>
                <li class="about"><a href="#about">About</a></li>
                <li class="service"><a href="#service">Services</a></li>
                <li class="work"><a href="#work">Work</a></li>
                <li class="contact"><a href="#contact">Contact</a></li>
            </ul>
        </div>
    </nav>