How can I compare two color values in jQuery/JavaScript?

Question

I get color value with jQuery with .css(\'color\'), and then I know color that it should be.

How can I compare color value that I get from jQuery with

Answer 1

Here is an approach that should work on all browsers using JQuery:

1. Create a hidden div
   on your HTML page. (Creating the dummy element dynamically with JQuery does not work for named colors)
2. Set the color of the dummy element to the expected color, i.e. $('#dummy').css('color','black');
3. Compare the color of the dummy element with the element you want to check

i.e.

if($('#element').css('color') === $('#dummy').css('color')) {
  //do something
}