Прослушиватель событий щелчка всегда скрывает все, кроме первого элемента ⇐ CSS

[Гость]

Это простая веб-страница, которую я создаю для личного использования. Цель состоит в том, чтобы сделать каждый раздел кликабельным: выбранный раздел будет расширяться с использованием кода анимации, который еще не добавлен, а другие элементы будут скрыты. Если щелкнуть тот же элемент, он вернется к исходному размеру, а другие элементы снова станут видимыми. Однако текущий код всегда приводит к тому, что первый элемент .item остается и скрывает остальные, независимо от того, по какому элементу щелкнули.

let isExpanded = false; const items = document.querySelectorAll(".item"); items.forEach(e => { e.addEventListener("клик", событие => { если (isExpanded === false) { items.forEach(f => { console.log(f.dataset.index); console.log(event.target.closest("[data-index]").dataset.index); if (f.dataset.index !== event.target.closest("[data-index]").dataset.index) { f.style.display = "нет"; } }); isExpanded = правда; } еще { items.forEach(g => { g.style.display = "inline-block"; }); isExpanded = ложь; } }) }); * { семейство шрифтов: Verdana, Женева, Тахома, без засечек; } тело { цвет фона: #0066ff; } #заголовок { белый цвет; } #список { ширина: 90%; маржа: авто; } .элемент { отображение: встроенный блок; ширина: 20%; поле: 20 пикселей; отступ: 0 10 пикселей; граница: сплошная синяя, 7 пикселей; радиус границы: 3 пикселя; цвет фона: белый; 「今週の英語フレーズ」履歴 10.10.2024 フレーズ: Как дела?

和訳：お元気ですか？

動画:
10.10.2024
フレーズ: Как дела?

和訳：お元気ですか？

動画:
10.10.2024
フレーズ: Как дела?

和訳：お元気ですか？

動画:
10.10.2024
フレーズ: Как дела?

和訳：お元気ですか？

動画: