DEV Community

Md Abdullah al noor
Md Abdullah al noor

Posted on

Answer: how toggle class vanilla js in complex situation

 document.querySelectorAll(".abstract-tab__content-view").forEach(function(item){
    item.addEventListener("click",function(e){
      e.preventDefault();
      if(e.target.parentElement.classList.contains('abstract-tab__content-view')){
       let dataKey = 0;
        dataKey = +e.target.parentElement.parentElement.nextElementSibling.getAttribute('data-key');
        abstractTabContentHide(dataKey)
        e.target.parentElement.parentElement.nextElementSibling.classList.toggle('display-none');
        return false;
      }else{
        e.preventDefault();
      }
    })
  })
  function abstractTabContentHide(key){
     
    document.querySelectorAll(".abstract-tab__content").forEach(function(item){
      // console.log(item.getAttribute('data-key'))
      let currentKey = +item.getAttribute('data-key');
      if(currentKey != key){
        if(!item.classList.contains('display-none')){
          item.classList.add('display-none');
           return false;
        }
        return false;
      }
      return false;
    }) ; 
    return false;
  }

Top comments (0)