JSFiddle - React, Tailwind, and code Playground

by Dedi Wibisono

HTML

<div class="dewasa">
  <label for="">
    <input type="radio" name="optradio-dewasa" class="radio">
    Mr
  </label>
  <label for="">
    <input type="radio" name="optradio-dewasa" class="radio">
    Mrs
  </label>
  <label for="">
    <input type="radio" name="optradio-dewasa" class="radio">
    Ms
  </label>
  <div class="result-error"></div>
</div>
<br>
<div class="dewasa">
  <label for="">
    <input type="radio" name="optradio-cantik" class="radio">
    tes
  </label>
  <label for="">
    <input type="radio" name="optradio-cantik" class="radio">
    hmm
  </label>
  <label for="">
    <input type="radio" name="optradio-cantik" class="radio">
    laaa
  </label>
  <div class="result-error"></div>
</div>

<button id="cekGender">cek</button>

JavaScript

function radioTest(check){
 var $result = check.parent().siblings(".result-error"); 
			var radios = $(".radio")
			console.log(radios.length)
      $result.text("");
		     for (var i = 0, len = radios.length; i < len; i++) {
		          if (radios[i].checked) {
              //alert('hee')
              radios[i].parent().siblings(".result-error").text('benar');
                  return false;
		          } 
		     }
		     //alert('salah')
         $(".result-error").text("salah")
		     return false;
		}
    $(document).on('click','#cekGender', function(){
      //radioTest($(this));
      var a = $(this);
      console.log(a)
      var b = a.prev().children().children(".radio")
      radioTest(b)
    })