Change collapsible list header colour when expanded

Question

I am using Jquery Mobile(1.4) for developing cross platform applications.

I want to be able to change the background color of the Collapsible list headers when they are expanded and set it back when collapsed.

Can anyone let me know how to change the background color of the "Collapsible list headers".

It would be better if we are able to do this through plain CSS.

Thank you in advance.

Answer 1

Change The Color As you wish

.ui-collapsible-heading-collapsed > .ui-collapsible-heading-toggle{
    background:red;
}

.ui-collapsible-heading-toggle{
    background:yellow;
}

DEMO