Untitled

const allFigures = document.getElementsByTagName("figure");
console.log(allFigures);

const allFigcaption = document.getElementsByTagName("figcaption");
console.log(allFigcaption);

const allCircles = document.querySelectorAll(".circle");
console.log(allCircles);

const allImages = document.getElementsByTagName("img");
console.log(allImages);

const allVideos = document.getElementsByTagName("video");
console.log(allVideos);

for (let i = 0; i < allFigcaption.length; i++) {
  console.log(i);
  allFigures[i].addEventListener("mouseover", function (event) {
    console.log(`figure ${i} is begin hovered`);
    console.log(allFigures[i]);

    allFigcaption[i].classList.add("brandname-when-hovered");
    allCircles[i].classList.add("circle-when-hovered");
    allImages[i].classList.add("blurr-when-hovered");
    allVideos[i].classList.add("blurr-when-hovered");
  });

  allFigures[i].addEventListener("mouseout", function (event) {
    console.log(`figure ${i} is begin left`);
    console.log(allFigures[i]);

    allFigcaption[i].classList.remove("brandname-when-hovered");
    allCircles[i].classList.remove("circle-when-hovered");
    allImages[i].classList.remove("blurr-when-hovered");
    allVideos[i].classList.remove("blurr-when-hovered");
  });
}