foreach is not function,how to solve this? js

i building caraousel container but there is a problem in this part.

enter image description here

  span class="cursor1" id="cursor1">&#10094;</span>
  <span class="cursor2" id="cursor2">&#10095;</span>
  <div class="kategori-container">
  <div class="border-box" id="border-box" >
  <div class="kategori-item">
  <div class="thumbler-bg"></div>
  <div class="produk-thumbler">
  <img class="thumbler-img" src="feature/images__15_-removebg-preview.png" alt="" srcset="">
  <div class="kategori-text">
  <span>produk kucing</span>
  </div>
  </div>
  </div>
  </div>

const featureContainers = [...document.querySelectorAll('.border-box')];
// console.log(featureContainers)
const cursorRight = [...document.querySelectorAll('.cursor1')];
const cursorLeft = [...document.querySelectorAll('.cursor2')];

featureContainers[0].forEach((objek, ruang) => {
let featureDimensions = objek.getBoundingClientRect();
let featureWidth = featureDimensions.width;
// console.log(ruang);
cursorRight[ruang].addEventListener('click', () => {
  objek.scrollLeft += featureWidth;
})
cursorLeft[ruang].addEventListener('click', () => {
  objek.scrollLeft -= featureWidth;
})

});

i’m stuck here,can someone help me?

>Solution :

forEach runs on array.. you are invoking it on first element using [0]

so instead of

featureContainers[0].forEach

do

featureContainers.forEach