JQuery - изменение цвета при нажатии

Я смотрю на некоторый jQuery, потому что я хочу создать div, который меняет цвет при нажатии на него.

И я сделал это с помощью:

$(function() {  
$('.star').click(function(){
    $(this).css('background', 'yellow');

  });
});

И он отлично работает! Но я хочу, чтобы он удалял фоновый цвет, когда вы нажимаете его еще раз. Это возможно, и как бы вы сделали что-то подобное?

Ответы

Ответ 1

Создайте класс CSS:

.clicked {
  background-color: yellow;
}

а затем просто переключить этот класс через jQuery:

$('.star').click(function(){
  $(this).toggleClass('clicked');
});

Ответ 2

Вы можете установить флаг в своей функции щелчка, затем добавить оператор if

if hasBeenClicked = true;
//...background color remove
else
//....background color changed to yellow

hasBeenClicked = true;

Ответ 3

Создание класса CSS также будет моим предложением, но вы также можете сделать это, чтобы "отменить" желтый фон:

$(this).css('background', 'inherit');