Как обратиться к блоку, который в поле видимости?

// find elements
var banner = $("#banner-message")
var button = $("button")
 
// handle click and add class
button.on("click", function(){
  banner.addClass("alt")
})

// ...содержимое страницы выше...
 
function isVisible(elem) {
 
  let coords = elem.getBoundingClientRect();
 
  let windowHeight = document.documentElement.clientHeight;
 
  // верхний край элемента виден?
  let topVisible = coords.top > 0 && coords.top < windowHeight;
 
  // нижний край элемента виден?
  let bottomVisible = coords.bottom < windowHeight && coords.bottom > 0;
 
  return topVisible || bottomVisible;
}

function showVisible() {
  for (let obj of document.querySelectorAll('класс объекта за которым будем наблюдать')) {
   
 
    if (isVisible(элемент который хотите проверить находится ли он в зоне видимости)) {
    действия над элементом  
    }
  }
}

function isVisible(elem) {
 
  let coords = elem.getBoundingClientRect();
 
  let windowHeight = document.documentElement.clientHeight;
 
  // верхний край элемента виден?
  let topVisible = coords.top > 0 && coords.top < windowHeight;
 
  // нижний край элемента виден?
  let bottomVisible = coords.bottom < windowHeight && coords.bottom > 0;
 
  return topVisible || bottomVisible;
}
 
function showVisible() {
  for (let obj of document.querySelectorAll('.box')) {
   
 
    if (isVisible($('.box'))) {
    console.log(this)
    }
  }
}
 
 
$(window).bind('wheel', function(event) {
    // ------- ВНИЗ
    if (event.originalEvent.deltaY >= 0) {
                  console.log("вниз");  
function showVisible() {
  for (let obj of document.querySelectorAll('.box')) {
    if (isVisible($('.box'))) {
    console.log(this);
    }
  }
}
    // ----ВВЕРХ
    } else {
                console.log("вверх");
       
        }
 
});

function isVisible(elem) {
 
  let coords = elem.getBoundingClientRect();
 
  let windowHeight = document.body.clientHeight;
 
  // верхний край элемента виден?
  
  let topVisible = coords.top > 0 && coords.top < windowHeight;
 
  // нижний край элемента виден?
  let bottomVisible = coords.bottom < windowHeight && coords.bottom > 0;
 
  return topVisible || bottomVisible;
}
 
function showVisible() {
  for (let obj of document.querySelectorAll('.IseeYou')) {   
  
    if (isVisible(obj)) {
    console.log("Смотри на меня ")
    console.log(obj)
 
    }
  }
}
showVisible();
 
 
 
window.onscroll = showVisible;

const observer = new IntersectionObserver((entries, observer) => {
    entries.forEach(n => n.target.classList.toggle('red', n.isIntersecting));
}, {
    threshold: 0.5
});
 
document.querySelectorAll('.box').forEach(n => observer.observe(n));

const Observer = new IntersectionObserver((entries, imgObserver) => {
    entries.forEach(e => e.isIntersecting && onVisible(e.target) )
},{ threshold: 0.5 });  // 0.5 - это число на которое элемент должен появиться в поле видимости (50%), если, к примеру, нужно обратиться к элементу только тогда когда он целиком виден то поменять 0.5 на 1 (100%)
 
document.querySelectorAll('.box').forEach(e => Observer.observe(e) );  // тут указываем свой клас за которым будем наблюдать
 
const onVisible = elm => {  // что делать с элементами которые в поле видимости
    console.log(elm);  // выводим их в консоль
}