JSFiddle - React, Tailwind, and code Playground

by camus

HTML

<div id="edit-status" class="form-radios">
<div class="form-item form-type-radio form-item-status">
<input type="radio" id="edit-status-0" name="status" value="0" class="form-radio"/>
<label class="option" for="edit-status-0">Bloqueado</label>
</div>
<div class="form-item form-type-radio form-item-status">
<input type="radio" id="edit-status-1" name="status" value="1" checked="checked" class="form-radio"/>
<label class="option checked" for="edit-status-1">Activo</label>
</div>
</div>

CSS

.form-item.form-type-radio.form-item-status{
       display:inline-block;        
    }

    .form-type-radio input[type=radio]
    {
        display: none;
    }

     .checked{
      background:#F00;
     }

JavaScript

$('label.option').click(function(){
    $('.form-item input[type=radio]').attr('checked',null);
    $('label.option').removeClass("checked");
    $(this).prev().attr('checked',"checked");
    $(this).addClass("checked");
})