クリック時のイベントで menuContents のクラス名を変更しているので、一回クリックしタナトた後は、クリック時のイベント内では document.querySelector('.menuContents');
では要素を取得できません。
読み込み時に menuContents を取得しておけばいいでしょう。
'use strict';
{
const menubtn = document.querySelector('.menubtn');
const menuContents = document.querySelector('.menuContents');
let flg = 0;
menubtn.addEventListener('click', function () {
flg = flg == 0 ? 1 : 0;
if (flg == 0)
menuContents.className = 'menuContents'
else if(flg == 1)
menuContents.className = 'menuContentsProject'
});
}
ちなみに、クラス名を書き換えるのではなく、クラス名(例えば open)を追加する仕様にすれば、classList.toggle() を使ってシンプルに記述できます。
'use strict';
{
const menubtn = document.querySelector('.menubtn');
const menuContents = document.querySelector('.menuContents');
menubtn.addEventListener('click', function () {
menuContents.classList.toggle("open")
});
}
.menuContents {
display: none;
}
.menuContents.open{
display: block;
}