JSFiddle - React, Tailwind, and code Playground

by rajeevRF

HTML

<div class="dfield">
  <div class="one_column">
    <label for="fieldname77_1_rb0" class="border-blue">
          <input name="fieldname77_1" id="fieldname77_1_rb0" class="field  group  required valid" value="0.8" vt="0.8" type="radio" aria-invalid="false"> <span>Small Car</span>
        </label>
  </div>
  <div class="one_column">
    <label for="fieldname77_1_rb1" class="border-blue">
          <input name="fieldname77_1" id="fieldname77_1_rb1" class="field  group  required valid" value="1" vt="1" type="radio" aria-invalid="false"> <span>Medium Car</span>
        </label>
  </div>
</div>

JavaScript

window.onload = function() {
  document.querySelectorAll('input[type="radio"]').forEach(function(el) {
    el.addEventListener('change', function() {
      if (this.checked) {
        this.parentNode.classList.add('border-blue');
      } else {
        this.parentNode.classList.remove('border-blue');
      }
    })
  })
}