jQuery toggleClass example

Toggle class name on click in jQuery

by Ayyappan Sakthivadivel

HTML

<input type="radio" name="radio" checked>
<input type="radio" name="radio">
<input type="radio" name="radio">

CSS

input[type="radio"]{
   appearance: none;
   border: 1px solid #d3d3d3;
   width: 30px;
   height: 30px;
   border-radius: 3rem;
   content: none;
   outline: none;
   margin: 0;
   box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

input[type="radio"]:checked {
  appearance: none;
  outline: none;
  padding: 0;
  content: none;
  border: none;
}

input[type="radio"]:checked::before{
  position: absolute;
  color: green !important;
  content: "\00A0\2713\00A0" !important;
  border: 1px solid #d3d3d3;
  font-weight: bolder;
  font-size: 21px;
     border-radius: 3rem;
}