Question

I want to put the radio button value in the status div. The text of status div should change, according to the radio button selected by the user.
The code that I used bellow is not working. Please help. Thanks!

HTML code:

 <form action="">
     <input type="radio" name="sex" value="male">Male<br>
     <input type="radio" name="sex" value="female">Female<br>
     <div id="status"></div>
  </form>​

JS code:

 $(document).ready(function () {
    RadioStatus="";

    $("input[type='radio']:checked").each( function()
    { 
        if ($(this).attr('checked');)
              RadioStatus=$(this).val();
              $("#status").text(RadioStatus);
        });

    $("input[type='radio']").change(function()  
     {
             RadioStatus= $('input[type='radio']:checked').val()
            $('#status').text(RadioStatus);        
    });
});

Answer 1

A few minor adjustments to your code got it to work just fine:

$(document).ready(function () {
    RadioStatus="";

    $("input[type='radio']:checked").each( function()
    { 
        if ($(this).attr('checked'))
              RadioStatus=$(this).val();
              $("#status").text(RadioStatus);
        });

    $("input[type='radio']").change(function()  
     {
             RadioStatus= $('input[type="radio"]:checked').val();
            $('#status').text(RadioStatus);        
    });
});​

see: http://jsfiddle.net/f6Tru/

..or you can really simplify it by using techfoobar’s:

$(document).ready(function () {
    $("input[type='radio']").click(function() {
        $('#status').text($(this).val());
    });
});​

instead. see: http://jsfiddle.net/RrhYM/