JSFiddle - React, Tailwind, and code Playground

HTML

<section class="trainers_listWrap">
   <li><label class="mt-radio mt-radio-outline traine">
      <input type="radio" data-value="One" class="trainerradio" value="62" name="trainernames">One
      <span></span>
      </label>
   </li>
   <li><label class="mt-radio mt-radio-outline traine">
      <input type="radio" data-value="Two" class="trainerradio" value="9" name="trainernames">Two
      <span></span>
      </label>
   </li>
   <li><label class="mt-radio mt-radio-outline traine">
      <input type="radio" data-value="THree" class="trainerradio" value="17" name="trainernames">THree
      <span></span>
      </label>
   </li>
   
</section>

JavaScript

//$('input:radio[name="trainernames"][data-value="One"]').prev('label').addClass('ui-radio-on').removeClass('ui-radio-off');

$('input:radio[name="trainernames"][data-value="One"]').prop('checked',true);


$("input[type='radio']").checkboxradio("refresh");