Question

As the title states I need some help on how to link this Jquery script for a show / hide effect to a radio button selection.

HTML

<tr>
<td><input type="radio" name="es_custom_reg" value="Y" /></td>
<td>Yes</td>
<td><input type="radio" name="es_custom_reg" value="N" /></td>
<td>No</td>
</tr>

Javascript

<script src="scripts/jquery.js" type="text/javascript"></script>

<script type="text/javascript">
      $(document).ready(function(){

   $('#slide').hide();

      $('a').click(function(){

   $('#slide').show('slow');

   });

   $('a#close').click(function(){
     $('#slide').hide('slow');
  })

    });
</script>

Answer 1

Try this:

$(function() {
    $('#slide').hide();
    $(':radio[name=es_custom_reg]').click(function() {
        var value = $(this).val();
        if (value === 'Y') {
            $('#slide').show('slow');
        } else if (value === 'N') {
            $('#slide').hide('slow');
        }
    });
});

And here’s a demo.