Не работает кнопка адаптивного меню?

Привет.
Есть адаптивное меню на сайте, при разрешении меньше 700пх меню перестраивается в вертикальном положении и скрывается, при нажатие на кнопку оно появляется. НО, если снова нажать кнопку меню, соответственно оно скроется. Затем если сайт сделать больше 700пх по идее оно должно уже перестроится в горизонтальное положение. Но меню почему то остается скрытым! Почему?

;(function () {
		"use strict";

		let menuBtn = document.querySelector(".icon-menu");
		let menu = document.querySelectorAll(".main-menu__item:not(.main-logo)");

		
			menuBtn.addEventListener("click", function () {
				menu.forEach(function (i) {
					if ( i.style.display !== "block") {
						i.style.display = "block";
					} else {
						i.style.display = "none";
					}
				})
			})
	})()

upd: решил проблему переписав код:

menuBtn.addEventListener("click", function () {
				menu.forEach(function (i) {
					i.classList.toggle("menu-open");
					console.log(i);	
				})
			})

.menu-open {
  display: block !important;
}