Почему не срабатывает click?

Question

[XXR]

Изучаю js и хочу научиться по click менять цвет, вообще взаимодействовать с css через click, подскажите почему не работает данный скрипт и может кто подкинет урок где именно через click менять css свойства

<div id="bg">

    </div>

#bg {
    background: red;
    width: 100%;
    height: 800px;
   
}

const bg = document.getElementById('bg');

bg.addEventListener('click', function() {
    document.style.backgroundColor = 'black';

})

Answer 1

[McBernar]

Не document.style, а bg.style
Вы же у bg стили меняете.

Comments

[XXR]

Спасибо

Answer 2

[Глеб]

Вроде bg.style.backgroundColor = 'black';
А вообще может удобнее будет пользоваться так:

bg.onclick = function () {
   bg.style.backgroundColor = 'black';
}

Comments

[XXR]

Спасибо, а если по клику вернуть назад родной цвет нужна ещё одна такая же фукнция?

[Кирилл Молчанов]

XXR, можно добавить класс с нужными стилями и с помощью bg.classList.toggle('class') переключать этот класс, тогда можно обойтись одним обработчиком.