Conditionally hide fields in a repeated block

Here's a tough one: Say, for example, I have a list of repeated Skills on a character sheet. If the character picks the "Language" skill, I want to have a sub-field appear where they list the specific language as a text input, but if they pick any other skill, I want to hide it. If this wasn't in a repeated block, I could just apply an attribute that sets attr-is-language to 'on' or 'off', then bind an invisible checkbox input to it, then use the CSS :checked selector to show/hide it accordingly. However, I don't think that would work when there's a whole list of invisible checkboxes that might or might not be checked, and I haven't been able to get it to work in testing. Is there some other workaround for this edge case?

I've done a few things with hiding repeating sections with the :checked selector, and have had minimal trouble, as long as everything's inside the repeating fieldset. An example from the PTU character sheet: HTML: <fieldset class='repeating_edges'> <br/> <!-- Checkbox to view/hide the instance. --> <input type="checkbox" class="sheet-arrow" name="attr_EdgeHide"/><span></span> <h4 class='sheet-minihead'>Edge</h4> <table class='sheet-table'> <!-- Row I want to be always visible --> <tr> <td class='sheet-table-header'>Name:</td><td><input class='sheet-shortfield' name='attr_EdgeName' type='text'></td> </tr> <!-- Row I want to be able to hide --> <tr class="sheet-featlist"> <td class='sheet-table-header'>Prerequisites:</td><td><input class='sheet-shortfield' name='attr_EdgePrereq' type='text'></td> </tr> <!-- Etc, etc. --> </table> </fieldset> CSS: /*There's more code than this, mostly for style, but this should be the active bit*/ /*By default, I want the extra info to be hidden:*/ tr.sheet-featlist { display: none; } /*But, I'd like to reveal it when the arrow is checked:*/ input.sheet-arrow:checked ~ table tr.sheet-featlist { display: table-row; } (Been a little while since I looked at the inner workings, so forgive me if something's missing here)

Hmmm... so, here's what I've got so far. HTML: <input type="checkbox" class="tech-mimic-check" name="attr_tech_is_mimic"> <div class="label tech-row tech-mimic-block">This is a mimic technique</div> CSS: .sheet-tech-mimic-check:unchecked ~ .sheet-tech-mimic-block {     display: none; } The checkbox is being populated correctly based on tech_is_mimic, but the div below it is just always visible. Am I off base here? EDIT: Aha! It seems that roll20/chrome/something supports :checked, but NOT :unchecked.

Just so you know, you can use this for when you want to check against something being "unchecked":  :not(:checked)

Thank you! I'll keep that in mind for the future.