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(nadya){
			var $result = nadya.parent().siblings(".result-error");
			var radios = $(".radio")
			console.log(radios.length)
      $result.text("");
			//var radios = $(".gender")
		     for (var i = 0, len = radios.length; i < len; i++) {
		          if (radios[i].checked) {
		              $result.text("benar");
		   						$result.css({"color":"green","margin-left":"25px","font-size":"10px"});
                  return false;
		          } 
		     }
		     //alert('salah')
         $(".result-error").text("salah")
		     return false;
		}
    
    /* $(".radio").on('click','#gender', function(){
    	radioTest($(this));
    })*/
    $(document).on('click','#cekGender', function(){
      //radioTest($(this));
      var a = $(this);
      var b = a.prevAll().children().children(".radio");
      radioTest(b)
    })