Show div1 if radio1 is checked, and div2 if radio2 is installed

Question

Hi guys, I have a problem.

I am extracting some values ​​from the database and I am showing them in an edit form. When editing is done, the values ​​will be sent back to the database.

I want to show a div if the radio is checked with the value "Yes", and if the radio is set to "No", I want to show another div.

The verified value comes from the database, so it is not always on the same radio.

<input type="radio" name="longer" id="Yes" value="Yes" <?=($info['longer']=='Yes')?'checked':''?>>Yes <input type="radio" name="longer" id="No" value="No" <?=($info['longer']=='No')?'checked':''?>>No <div id="first"> Show if value is yes </div> <div id="second"> Show if value is no </div> 

This is the jquery code that I have had so far, but it does not work:

 $(document).ready(function() { if ($('#No').prop('checked')) { $('#first').hide(); $('#second').show(); } else if ($('#Yes').prop('checked') { $('#second').hide(); $('#first').show(); } }); 

Thank you for your time.

Answer 1

check with .is(':checked')

 if ($('#No').is(':checked')) { 

your code will work after the document is ready. but I think you may need it in a radio change event

  $('input[name="longer"]').on('change',function(){ //code here });