CLiown
CLiown

Reputation: 13843

jQuery - re-use CSS value on another element

I have a background colour set on a series of buttons, .button1, .button2., .button3 & .button4. Each of these buttons has a different background colour set in CSS.

I want to use jQuery to detect the background colour of the button when it is clicked and apply that colour to .toolbar.

Is this possible?

Upvotes: 1

Views: 309

Answers (2)

Amy B
Amy B

Reputation: 17977

$('button').click(function()
{
    $('.toolbar').css('background-color', $(this).css('background-color'));
});

Upvotes: 0

Sarfraz
Sarfraz

Reputation: 382696

You could do:

$('button[class^="button"]').click(function(){
  $('.toolbar').css('background-color', $(this).css('background-color'));
});

This is generic and will automatically detect clicked button rather than writing code for each button having different classes. Also, this code makes sure that it does the stuff only for those buttons whose class names start with button.

Upvotes: 4

Related Questions