changing CSS value with jquery -

when adapted-for-no-javascript page loads, 1 of styles loaded this:

//accordion open .accordionitemcollapsed, .accordionitem.is-collapsed {     max-height: 100%; } 

that way accordion open , content visible users without javascript.

but when user has javascript enabled visits site, value changed automatically this:

//accordion collapsed .accordionitemcollapsed, .accordionitem.is-collapsed {     max-height: 0; } 

how best jquery?

this quite elementary new jquery/js , bit lost googling solutions because search hits seem apply more complicated cases.

instead of changing or injecting css, suggest adding no-js class body/html/container , removing jquery.

your css this

.accordionitemcollapsed, .accordionitem.is-collapsed {     max-height: 0; }  .no-js .accordionitemcollapsed, .no-js .accordionitem.is-collapsed {     max-height: 100%; } 

the jquery straightforward

$('html').removeclass('no-js'); 

this approach more efficient querying dom accordions , changing style property of every element.

in addition that, can reused other parts of website need have different styling when js not available.