CODEWITHSUNDEEP
jquery
skolind
skolind

Reputation: 1754

jQuery - Change color on click

I'm looking at some jQuery because I want to create a div that changes color when you click it.

And I've done that with: 

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

  });
});

And it works perfectly! But I want it to remove the background color, when you click it one more time. Is that possible, and how would you do something like that?

Upvotes: 15

Views: 72940

Answers (3)

Tomalak
Tomalak

Reputation: 338178

Create a CSS class:

.clicked {
  background-color: yellow;
}

and then simply toggle that class it via jQuery:

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

Upvotes: 27

Jon
Jon

Reputation: 437366

Creating a CSS class would be my suggestion as well, but you can also do this to "unset" the yellow background:

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

Upvotes: 2

Danielle Stone
Danielle Stone

Reputation: 170

You could set a flag in your click function, Then add an if statement

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

hasBeenClicked = true;

Upvotes: 2

Related Questions