Не работает JavaScript?

Question

[Sticky Rain]

Почему он выдает ошибку?

let openBtn = document.querySelectorAll('.btn-pic')

 	for (let i = 0; i < openBtn.length; i++) {
 		openBtn[i].onclick = showDownloadWindow;
 	}
 	
 function showDownloadWindow() {
 	openBtn.style.backgroundColor = 'red';
 }

В консоле пишет:
script.js:8 Uncaught TypeError: Cannot set property 'backgroundColor' of undefined
at HTMLAnchorElement.showDownloadWindow (script.js:8)

Comments

[Михаил]

openBtn это лист, у которого нет .style

[Sticky Rain]

Михаил, а можно поподробнее? Я же не щарю.

[Михаил]

Sticky Rain, куда уж подробнее
вы пытаетесь поставить .style на 1 элемент,
а querySelectorAll возвращает лист элементов

[Sticky Rain]

Михаил, ну не знаю... Без for цикла все работает.

[Лев Забудкин]

document.querySelectorAll('.btn-pic').forEach(el => {
        el.style.backgroundColor = 'red';
    });

[Пашенька]

Sticky Rain, openBtn - это массив(грубо говоря, на самом деле array-like), нельзя ему вот просто так пытаться установить стили. Это можно сделать для некоторого элемента этого массива: openBtn[0].style.и так далее

Answer 1

[Лев Забудкин]

document.querySelectorAll('.btn-pic').forEach(el => {
        el.style.backgroundColor = 'red';
    });

Ещё в догонку, если jQuery подключено, то при нажатии на элемент, он станет красным:

$(".btn-pic").click(function(el) {
     el.style.backgroundColor = 'red';
});