beau radio

css
.checker {
    position: relative;
    float: right;
    display: inline-block;
    margin-top: 1rem;
    margin-right: 2rem;
}
.beau-radio.active {
    border: 0px;
    background-color: #ffc001;
    -webkit-box-shadow: inset 0px 3px 8px rgba(0, 0, 0, 0.86);
    -ms-box-shadow: inset 0px 3px 8px rgba(0, 0, 0, 0.86);
    box-shadow: inset 0px 3px 8px rgba(0, 0, 0, 0.86);
}
.beau-radio {
    position: absolute;
    width: 39px;
    height: 39px;
    border: 2px solid #8b8b8b;
    border-radius: 6px;
    -webkit-box-shadow: 0px 0px 1px #c7c7c7;
    -ms-box-shadow: 0px 0px 1px #c7c7c7;
    box-shadow: 0px 0px 1px #c7c7c7;
    z-index: 50;
}
input[type='radio'] {
    -webkit-appearance: none;
    border: 1px solid darkgray;
    border-radius: 50%;
    outline: none;
    -shadow: 0 0 5px 0px gray inset;
    width: 2rem !important;
    height: 2rem !important;
    vertical-align: text-bottom;
}
input[type='radio']:checked:before {
    background: #ffc001;
}
input[type='radio']:before {
    content: '';
    display: block;
    width: 60%;
    height: 60%;
    margin: 20% auto;
    border-radius: 50%;
}
.checker .yellow-radio {
    position: absolute;
    width: 3rem !important;
    height: 3rem !important;
    opacity: 0;
    z-index: 100;
}
.beau-radio.active .iconfont {
    opacity: 1;
}
.beau-radio .iconfont {
    opacity: 0;
    font-size: 34px;
    font-weight: 700;
    margin-left: .2rem;
    vertical-align: text-bottom;
}
.beau-radio.active .iconfont {
    opacity: 1;
}

<div class="checker">
    <div class="beau-radio">
        <span class="iconfont icon-gou"></span>
    </div>
    <input type="radio" class="yellow-radio" name="xuanze-paiwei"/>
</div>

$(".yellow-radio").on("click", function () {
        var radio = $(".yellow-radio");
        for(var i=0;i<radio.length;i++)
        {
            if(radio[i].checked)
            {
                $(radio[i]).siblings(".beau-radio").addClass("active");
            }else{
                $(radio[i]).siblings(".beau-radio").removeClass("active");
            }
        }
    });