Disable radio button using Closest in JQuery

Question

How to disable radio button on both sides on clicking of radio button in center using Closest?

<div class="pure-u-1 pure-u-md-1-5">
    <span style="white-space: nowrap;">
    <span style="display: inline-block;">
        <label for="COMA">
            <p>
                <input type="radio" value="Yes" name="COM" id="COM0"> 
                Yes &nbsp;&nbsp; 
            </p>
        </label>
    </span>

    <span style="display: inline-block;">
        <label for="COMA">
            <p>
                <input type="radio" checked="checked" value="No" name="COM" id="COM1"> 
                No &nbsp;&nbsp; 
            </p>
        </label>
    </span>

    <span style="display: inline-block;">
        <label for="COMA">
            <p>
                <input type="radio" value="NA" name="COM" id="COM2"> 
                NA &nbsp;&nbsp; 
            </p>
        </label>
    </span>
    </span>
</div>

On Click of No, i want to disable YES and NA radio button, but not by using any looping/iterations or disabling on static Name or ID, but want Jquery methods closest or siblings to do the same.

How is this possible in JQuery using it?

Answer 1

You can do it like this, basically you take the closest <div> and then find all <input> of type radio but the "No" radio and disable them.

$("#COM1").on("click", function() {
    var $no = $(this);
    $no.closest("div").find("input:radio").not($no).attr("disabled", true);
});

See this http://jsfiddle.net/4459rqtp/

Answer 2

Try this

DEMO HERE

$('input[type=radio]').on('click',function(){
    $("input:radio").attr('disabled',true);
    $(this).removeAttr('disabled');
});

or just with a single line

DEMO

$('input[type=radio]').on('click',function(){
    $("input:radio").not($(this)).attr('disabled',true);
});