Question

I’ve tried achieving a hover/selected color change for a particular field, but I’m thinking jQuery is the answer. I’ve looked into some button click tutorials, but maybe I’m not just seeing it or doing it correctly.

The idea here is that when a user hovers over a Headline, the background color changes, when they click the headline to expand it, the background color remains constant (selected), however as it stands right now the background color of the expanded fields do not change.

Here is the demo:
http://www.notedls.com/demo

Answer 1

I see that you have JQuery add a selected class to your li element when clicked. Depending on what you want to do, you can color the li.selected background color, or target the div based on the li.selected element.

ul#acc1 li.selected {
   background-color: #xxxxxx;
}

ul#acc1 li.selected div {
   background-color: #xxxxxx;
}