Address CSS general sibling selector and input:checked

I’ve tried to address styles defined like this:

header input[type=checkbox] ~ div#example {max-height:0px;}

header input[type=checkbox]:checked ~ div#example {max-height:100px;}

I would like to do something like

document.getElementById('example').style.maxHeight='10px';

but it should only change

input[type=checkbox]:checked

not the unchecked Version.

Maybe there is a way with nextElementSibling? Thanx for your help!