Using jQuery to check value of radio select not working

Question

Following some previously answered questions her on Stack Overflow I am trying to show a div if the 'Female' radio box is checked and hide if the 'Male' checkbox is checked - this is the code I am using and it doesn't seem to do anything:

jQuery

jQuery(document).ready(function () {

    jQuery('#genderSelect input:radio').click(function () {


        if (jQuery('#genderSelect input:radio').val() === 'Female') {
            jQuery(".joinFemaleForm").show("slow", function () {
                // Animation complete.
            });
        } else if (jQuery('#genderSelect input:radio').val() === 'Male') {
            jQuery(".joinFemaleForm").hide("slow", function () {
                // Animation complete.
            });
        }
    });

});

HTML

<span class="wpcf7-form-control wpcf7-radio" id="genderSelect">
    <span class="wpcf7-list-item first"><input type="radio" name="male-female" value="Male">&nbsp;<span class="wpcf7-list-item-label">Male</span></span>
    <span class="wpcf7-list-item last"><input type="radio" name="male-female" value="Female">&nbsp;<span class="wpcf7-list-item-label">Female</span></span>
</span>

http://stackoverflow.com/questions/8622336/jquery-get-value-of-selected-radio-button — Jonathan.Brink, Sep 10 '15 at 11:45

Tushar · Accepted Answer · 2015-09-10T11:47:25.410

3

Use :checked to get the element that is selected.

jQuery('#genderSelect input:radio:checked').val()
//                               ^^^^^^^^

edited Sep 10 '15 at 11:47

answered Sep 10 '15 at 11:45

Tushar

85,780
21
159
179

score -1 · Answer 2 · answered Sep 10 '15 at 11:48

-1

Try below code.

var checkval = $("#genderSelect").find("input[type='radio']:checked").val();
alert(checkval);

answered Sep 10 '15 at 11:48

Vishal Kiri

1,248
1
12
24

Using jQuery to check value of radio select not working

2 Answers2