В чем ошибка данного js кода?

Question

[Михаил]

function startQuest() {
	var startLink = document.getElementById("button_one");
	startLink.onclick = function() {
		var title = document.querySelectorAll('h1');
		title.style.display="none";
	}
}

При нажатии должен исчезать заголовок.

<h1 text-align: center>Викторина</h1>
<a href="#" class="button button_one">Начать тест</a>

Answer 1

[alex]

document.getElementById("button_one")

у вас нет элемента с id="button_one"

document.querySelectorAll('h1')

возвращает группу элементов

function startQuest() {
  var startLink = document.querySelector('.button_one');
  startLink.onclick = function() {
    var title = document.querySelector('h1');
    title.style.display = 'none';
  }
}

Answer 2

[Stalker_RED]

querySelectorAll возвращает NodeList, у которого нет свойства style.

Нужно перебрать все элементы и каждому установить стиль.

Answer 3

[somebrerro]

function startQuest() {
  var startLink = document.getElementById("button_one");
  startLink.onclick = function() {
    var titles = document.querySelectorAll('h1');
    titles.forEach(title => {
      title.style.display = 'none';
    })
  }
}

вот это больше похоже на правильный вариант