Почему при нажатии на кнопку не скрывается элемент?

.cards {
    position: relative;
    height: 45vh;
    overflow-y: scroll;
    overflow-x: hidden;
}

.cards__all {
    padding: 15px 0;
}

.cards__true {
    padding: 15px 0;
}

.cards__false {
    padding: 15px 0;
}

<div class="cards">
            <div class="preloader__wrapper">
                <span class="spinner spinner-large spinner-blue spinner-slow"></span>
            </div>

            <div class="cards__all hidden">

            </div>
            <div class="cards__true hidden"></div>
            <div class="cards__false"></div>
        </div>

Сейчас речь идет о блоке dropdown. Помогите пожалуйста сделать так, чтобы при повторном нажатии элемент dropdown__content скрывался

cardsFalse.innerHTML += `
        <div class="card">
            <div class="card__content">
                <div class="card__group-one">
                    <button><img class="card__checkbox card__checkbox-inProgress" id=${card.id} src="/source/img/inProgress.svg" alt=""></button>
                    <div>
                        <div class="card__title">${card.Title}</div>
                        <div class="card__desc">${card.Desc}</div>
                    </div>
                </div>
                
                <div class="card__group-two">
                    <div>
                        <div class="card__info">${card.Info}</div>
                        <div class="card__date">${card.Date}</div> 
                    </div>
                    <div class="dropdown">
                        <button><img src="/source/img/more.svg" class="card__more" data-menu=menu_${card.id}_nocompleted alt=""></button>
                        <div class="dropdown__content hidden" id=menu_${card.id}_nocompleted>
                            <button class="card__edit" id=${card.id}><img src="/source/img/edit.svg" alt="">Редактировать</button>
                            <button class="card__delete" id=${card.id}><img src="/source/img/delete.svg" alt="">Удалить</button>
                        </div>
                    </div> 
                </div>      
            </div>
        </div>
        
        
// Код кнопки
const cards = document.querySelector('.cards');

function menuHidden () {
    let menuEdit = document.querySelectorAll('.dropdown__content');
    menuEdit.forEach((item) => {
        item.classList.add('hidden')
    })
}

cards.addEventListener('click', (e) => {
    if(e.target.classList.contains('card__more')) {
        menuHidden();
        let c = e.target.getAttribute('data-menu');
        document.querySelector(`#${c}`).classList.toggle('hidden');
    }
})
.hidden {
  display: none;
}


Ответы (0 шт):