Question

Page code as below:

<input type="radio" class="direct" name="r1" value="first" />
    <span class="proxy">radio1</span>
<input type="radio" class="direct" name="r1" value="second" />
    <span class="proxy">radio2</span>

js code as below:

$('.direct').click(function(e) {
    var obj = $(this).parent(),
        value = obj.find('input:checked').val();
    if(value){
        alert('you click ' + value + ' button');
    }else{
        alert('you did not click a button');
    }
});
$('.proxy').click(function(e) {
    $(this).prev().click();
});​

Here is the example on JSFiddle

My question is:
why clicking on span text does not work like clicking directly on radio button?

Answer 1

As i said earlier, question was not clear, at least for me. however, if you want to get the radio checked when clicked on next span, you can do this way:

$('.proxy').click(function(e) {
    $(this).prev().attr('checked', true)
});​