IntersectionObserver.js

const navbar = document.querySelector(".navbar"),
  sectionKelas = document.querySelectorAll(".section-kelas");

// initialize IntersectionObserver
const io = new IntersectionObserver((entries) => {
  // entries are array of element e.g: [<div></div>, <p></p>]
  // loop through the element
  entries.forEach((entry) => {
    // assign the data set attribute 
    const kelas = entry.target.dataset.kelas;
    // let's check if entry is on the viewport
    if (entry.isIntersecting) {
      
      // below here run your condition and start to manipulate navbar
      if (kelas === "kelas-13") {
        navbar.style.backgroundColor = "#db0025";
      }
      // if you want to unobserve each element when they're done, uncomment below code
      // io.unobserve(entry.target);
    }
  });
});

// first loop the array of element into one picee
sectionKelas.forEach((element) => {
  // each element of section-kelas, observe with InterSectionObserver
  io.observe(element);
});