[Vuejs]-How do I add a Class to Specific Parent Elements ONLY if the Child Container has Content

by

0👍

✅

Maybe not the best solution but i think you get it because you had some issues in your code 🙂

var slickSlide = document.querySelectorAll('.slick-slide');

for (var i = 0; i < slickSlide.length; i++) {
  if (slickSlide[i].children.length === 0) {
    slickSlide[i].remove();
  }
}

EDIT:
You have the search for empty divs and remove them until no empty is find because after removing an empty the parent is empty the next time.

In this example i wrapped all slick-slide elments into a .slide-wrapper class

var slickSlide = document.querySelector('.slide-wrapper').getElementsByTagName('div');

function removeAllEmptys() {
    var divCount = slickSlide.length;
    for (var i = 0; i < slickSlide.length; i++) {
    if (slickSlide[i].children.length === 0) {
      slickSlide[i].remove();
    }
  }
  
  if (divCount !== slickSlide.length) {
    removeAllEmptys();
  } else {
    return false;
  }
 
}

removeAllEmptys();

This will only keep the .slick-slide elements with the category in it

Leave a comment