Не происходит вывод в консоль по клику (JS)

Пытался сделать табы на js, но в данном случае не выводит ничего в консоль. Хотел, чтобы при нажатии менялся фон у конкретного элемента, но на стадии проверки функции при клике уже пошло что-то не так

html:

<button class="nav-btn active">option_1</button>
<button class="nav-btn">option_2</button>
<button class="nav-btn">option_3</button>

css:

.nav-btn {
  height: 30px;
  width: 70px;
  background-color: #2d283e;
}
.nav-btn.active {
  background-color: #3a3350;
}

JS:

const settingsBtn = document.querySelectorAll("nav-btn")

settingsBtn.forEach(function (item) {
  item.addEventListener("click", function () {
    console.log("YOOOOOOOOO")
  })
})

В чем может быть проблема?