JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="id_priori">
    <li>
       <label for="id_priori_0">
            <input id="id_priori_0" name="priori" type="radio"/>Hola
       </label>
    </li>
    <li>
        <label for="id_priori_1">
            <input id="id_priori_1" name="priori" type="radio"/>Hola
        </label>
    </li>
    <li>
        <label for="id_priori_2">
            <input id="id_priori_2" name="priori" type="radio"/>Hola
        </label>
    </li>
    <li>
        <label for="id_priori_3">
            <input id="id_priori_3" name="priori" type="radio"/>Hola
        </label>
    </li>
    <li>
        <label for="id_priori_4">
            <input id="id_priori_4" name="priori" type="radio"/>Hola
        </label>
    </li>
</ul>

CSS

.on  {
    color: blue;
}

ul {
    list-style-type: none;
}



li {
    background-color: yellow;
    width: 300px;
}

JavaScript

$("#id_priori").on('click', 'li', function () {
    $(this).find(':radio').prop('checked', true);
   $(this).addClass('on').siblings().removeClass('on');
});