Подскажите, как сделать открытие по клику на js. Суть в том, что у меня есть определённое кол. блоков, при нажатии на блок, должно появляться окно с его настройками. Кол. этих блоков динамическое, и выдавать разные id им не выйдет.
var block = document.getElementById('settings');
document.addEventListener('click', function(e) {
if (e.target.id == 'trigger') {
block.classList.remove('hide');
}
if (e.target.id != 'trigger') {
block.classList.add('hide');
}
});
*{color: #fff;}
.user {background: #000;height: 50px; margin: 10px 0;}
.settings {cursor: pointer;}
.hide {display: none;}
<div class="blocks">
<div class="user" id="user">
<span class="settings" id="trigger">Открыть настройки</span>
<div id="settings" class="hide">
<span>настройка1</span>
<span>настройка2</span>
</div>
</div>
<div class="user" id="user">
<span class="settings" id="trigger">Открыть настройки</span>
<div id="settings" class="hide">
<span>настройка1</span>
<span>настройка2</span>
</div>
</div>
<div class="user" id="user">
<span class="settings" id="trigger">Открыть настройки</span>
<div id="settings" class="hide">
<span>настройка1</span>
<span>настройка2</span>
</div>
</div>
</div>