Dynamic changes to checkboxes don't seem to trigger a css 'refresh'

[hannesfostie]

Hi

I just built a select-all checkbox to check all other checkboxes in the form.

$('#select_all').on 'click', -> $('.checkbox-list input[type=checkbox]').prop('checked', $(this).prop('checked'))

The problem is that my styles are changing based on your parent selector:

label! > .has-access:checked { background: #e87d80; }

This works perfectly when checking only one checkbox. The options to make this work are firing a click event on each of them, or calling the cssParentSelector function but both are hacky and not very performant.

Any idea if this can be resolved at all? I was left scratching my head trying to figure it out myself.