JSFiddle - React, Tailwind, and code Playground
HTML
<div class="slider">
<div class="input-box">
<input type="radio" name="slide" id="slide_1" checked>
<input type="radio" name="slide" id="slide_2" >
<input type="radio" name="slide" id="slide_3" >
</div>
<label for="slide_1">111</label>
<label for="slide_2">222</label>
<label for="slide_3">333</label>
</div>
CSS
.slider > label{
width: 500px;
height: 100px;
/*position: absolute;*/
}
.input-box{
position: absolute;
z-index: 2;
left: 50%;
}
JavaScript
$("label").css("background-color", "red"); // сделали фон label красным
$("input:radio:checked"); // нашли выбранный input
$("input:radio:checked").attr('id'); // получили id отмеченного input
// взять label c for = id отмеченного input и поменять цвет
$("label[for='slide_1']").css("background-color", "green"); // сюда нужно впихнуть вместо slide_1 вот это $("input:radio:checked").attr('id');
console.log( $("input:radio:checked") );
console.log( $("input:radio:checked").attr('id') );
console.log( $("label[for='slide_1']") );