0

I'm not sure if this is possible via jQuery or other approach, but i've incorporated the theme switcher widget into my web app. I have a set of Selectable UI elements that I'd like to color the same as the current theme's ui-state-highlight color upon page load/theme switch. I'm attempting to store the value of the background in a var, so I can use .css to set the selectable color to match.

input = $('.ui-state-highlight').css('background')

returns undefined, but if I try with 

input = $('.ui-state-default').css('color')

I can return a value.

What did I miss?

j08691
  • 204,283
  • 31
  • 260
  • 272
John
  • 3
  • 2

1 Answers1

1

Your first example you have no period before 'ui-state-highlight' so you are trying to select elements with a TYPE of ui-state-highlight (as opposed to a type of DIV, INPUT, SELECT, etc)

 $('ui-state-highlight')

Your second example you actually select elements with a class of 'ui-state-default'

 $('.ui-state-default')

Edit: Based on your corrections I am guessing that the problem here is that you may be trying to get the background color for any elements with the ui-state-highlight class but there aren't any actually displayed on your page.

Try the following code, based on answer to Get a CSS value from external style sheet with Javascript/jQuery

var $p = $("<p class='ui-state-highlight'></p>").hide().appendTo("body"); 
input = $p.css("background"); 
$p.remove();

You create a new <p></p> temporarily and then grab the background color off it before removing it.

Community
  • 1
  • 1
nvuono
  • 3,323
  • 26
  • 27
  • my mistake, that was a typing fail. I do have the period before my selector, my return is undefined. – John May 18 '12 at 00:44
  • I've updated my answer so let me know if it helps at all now or I will delete it to make sure others correctly see your question as 'unanswered' – nvuono May 18 '12 at 00:57