Hallo,
Genau. Es gibt keine Rückwärts-Selektoren, man kann nicht hoch zum Elternelement gehen. Das ist aus Gründen der Performance so.
Da ich meine Antwort schon erstellt hatte, poste ich Sie, vielleicht ist es für Dich doch noch brauchbar:
HTML:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">.rot {color:red;}</style>
<title>Beispiel</title>
</head>
<body>
<table id="selectstuff" cellspacing="0">
<tbody>
<tr>
<td class="label">
<input id="auswahl1" type="radio" name="auswahl" />
<label for="auswahl1">L<br>I<br>V<br>E</label>
</td>
<td>
... Inhalt 1 ...
</td>
<td class="label">
<input id="auswahl2" type="radio" name="auswahl" />
<label for="auswahl2">P<br>R<br>O<br>M<br>O</label>
</td>
<td>
... Inhalt 2 ...
</td>
...
</tr>
</tbody>
</table>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="highlight.js"></script>
</body>
</html>
Javascript (highlight.js), Ich verwende JQuery:
(function() {
$(document).ready(function(){
var radiobuttons = $("#selectstuff input[type='radio']");
radiobuttons.change(function() {
radiobuttons.each(function(){
var button = $(this);
if (button.is(':checked')) {
button.parent().next().addClass("rot");
} else {
button.parent().next().removeClass("rot");
}
});
});
});
})();
Gruß, Leander