Question

I have html:

<div class="box">
    <input name="radio-1" value="1" type="radio" class="radio">
    <div class="hidden_box">
    some content
    </div>
</div>

<div class="box">
    <input name="radio-2" value="1" type="radio" class="radio">
    <div class="hidden_box">
    some content
    </div>
</div>

…. and so on

When I click on radio button I need to make “hidden_box” visible in this “box” div. How can I do it?

Please, help.

Answer 1

Since you tagged your Q with jQuery, I’ll use that:

$('.radio').click(function(){
    $(this).parent().find('.hidden_box').show();
});

See working example.

UPDATE: If you want to apply this to all present and future ‘.box’ items, use:

$('.radio').live('click', function(){
        $(this).parent().find('.hidden_box').show();
});