My radio buttons are not selecting when they are clicked and there no errors found on the inspect element from the browser. What could be the problem? because i used the correct name and bind them on the jquery function call.

`// Javascript
   /**
    *@author:Gcobani Mkontwana
    @date:02/03/2023
    @select radio buttons during form application for loan.
    */ 
   $(document).ready(function(){
        $("input[type='button']").click(function(){
            var radioValue = $("input[name='gender']:checked").val();
            if(radioValue){
                alert("Your are a - " + radioValue);
            }
        });
    });

// HTML code
     <!--Radio Select -->
                                           <div class="select-radio6">
                                                <div class="radio">
                                                    <input id="gender" name="gender" type="radio" value="male">
                                                    <label for="radio-6" class="radio-label">Male</label>
                                                </div>
                                                <div class="radio">
                                                    <input id="gender" name="gender" type="radio" value="female">
                                                    <label for="radio-6" class="radio-label">Female</label>
                                                </div>
                                            </div>`

>Solution :

I think your code is working fine, when i added a buttton

$(document).ready(function(){
        $("input[type='button']").click(function(){
            var radioValue = $("input[name='gender']:checked").val();
            if(radioValue){
                alert("Your are a - " + radioValue);
            }
        });
    });
    
    

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="select-radio6">
     <div class="radio">
    <input id="gender" name="gender" type="radio" value="male">
 <label for="radio-6" class="radio-label">Male</label> </div>
        <div class="radio">
   <input id="gender" name="gender" type="radio" value="female">
 <label for="radio-6" class="radio-label">Female</label>
                </div>
                <input type='button' name = 'submit' value = 'submit'/>
</div>