Я хочу по нажатию на кнопку переключить class у скрытых блоков, проще говоря сделать их видимыми, использовал такой код:
window.onload = function() {
var btn = document.querySelector(".btn");
btn.onclick = function() {
var items = document.querySelectorAll('.flex .item');
items.classList.toggle('active');
}
};
* {
margin: 0;
padding: 0;
list-style: none;
text-decoration: none;
box-sizing: border-box;
}
.item {
width: 200px;
height: 200px;
background: #ccc;
margin: 10px;
visibility: hidden;
opacity: 0;
transition: 0.35s;
}
.active {
visibility: visible;
opacity: 1;
}
.flex {
display: flex;
flex-wrap: wrap;
width: 660px;
margin: auto;
}
<div class="flex">
<div class="item">1</div>
<div class="item">2</div>
<div class="item">3</div>
<div class="item">4</div>
<div class="item">5</div>
</div>
<button class="btn">Показать</button>
Скажите где я ошибся ?