JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <input type="radio" name="q" id="yes" />
    <input type="radio" name="q" id="no" />
</div>

CSS

.container {
    margin: 10px;
}
label {
    padding: 6px 12px;
    background-color: #666;
    color: #fff;
}
input[type=radio] {
    -webkit-appearance:none;
    background:black;
    height:50px;
    width:50px;
    padding:10px;
    color:white;
    float:left;
    margin:5px;
}
input#yes:before, input#yes::before {
   content:"Yes";
}
input:before, input::before {
    line-height:30px;
    width:100%;
    text-align:center;    
}
input#no:before, input#no::before {
   content:"No";
}
.selected {
    background-color: #000;
}

JavaScript

$(function() {
    $('input').click(function () {
       $('input').removeClass('selected');
       $(this).addClass('selected');
    });        
});