jQuery blur not firing on radio button

Question

Below is the syntax I'm using to try and attach a .blur event to a radio button (this code is inside document.ready) in my ASP MVC 3 view.

I also don't see any errors in Chrome's debugging Console or Sources Console. I've also tried this in IE and was unable to get it to work (I've read that Chrome has a problem w/the blur events). Any help would be greatly appreciated.

I've tried the following tags: #AlignmentL and #AlignmentL:radio but without any luck.

    $('AlignmentL:radio').blur(function () {
        alert('Inside AlignmentL');
        if ($('#LocationZip').val() != "" && $('#LocationState').val() != "" && $('#channelName').html() != "") {
            getDrmTerritory($('#LocationZip').val(), $('#LocationState').val(), $('#channelName').html());
        }
        else if ($('#channelName').html() != "") {
            $('#channelName').html() = "";
        }
    });

EDIT

Here is the related HTML from the ASP MVC view

    <div class="M-editor-label">
        @Html.LabelFor(model => model.AlignmentAddressInd)<span class="req">*</span>
    </div>
    <div class="M-editor-field" onclick="CheckTerritory('align');">
        @Html.RadioButtonFor(model => model.AlignmentAddressInd, "M", new { Checked = "checked", id = "AlignmentM" }) Mailing  
        @Html.RadioButtonFor(model => model.AlignmentAddressInd, "L", new { id = "AlignmentL" }) Location 
        @Html.ValidationMessageFor(model => model.AlignmentAddressInd)
    </div>

SECOND EDIT

It just occurred to me that since I have this .blur set on both radio buttons I might have one cancelling the other out. Here is what the full section

    $('#AlignmentL:radio').blur(function () {
        alert('Inside AlignmentL');
        if ($('#LocationZip').val() != "" && $('#LocationState').val() != "" && $('#channelName').html() != "") {
            getDrmTerritory($('#LocationZip').val(), $('#LocationState').val(), $('#channelName').html());
        }
        else if ($('#channelName').html() != "") {
            $('#channelName').html() = "";
        }
    });

    $('#AlignmentM:radio').blur(function () {
        alert('Inside AlignmentM');
        if ($('#MailingZip').val() != "" && $('#MailingState').val() != "" && $('#channelName').html() != "") {
            getDrmTerritory($('#MailingZip').val(), $('#MailingState').val(), $('#channelName').html());
        }
        else if ($('#channelName').html() != "") {
            $('#channelName').html() = "";
        }
    });

THIRD EDIT

Nevermind, I commented one of the radio buttons out and it is still not working.

Answer 1

I had to abandon the .blur method (which might be the better idea anyway since this I want these events to fire when clicked, not when they lose focus) and use .change. Everything's working ok now.

    $('#AlignmentM:radio').change(function () {
        alert('Inside AlignmentM');
        var channel = $.trim($('#channelName').html());
        if ($('#MailingZip').val() != "" && $('#MailingState').val() != "" && channel != "") {
            getDrmTerritory($('#MailingZip').val(), $('#MailingState').val(), channel);
        }
        else if ($('#territoryName').html() != "") {
            $('#channelName').html() = "";
        }
    });

    $('#AlignmentL:radio').change(function () {
        alert('Inside AlignmentL');
        if ($('#LocationZip').val() != "" && $('#LocationState').val() != "" && $('#channelName').html() != "") {
            getDrmTerritory($('#LocationZip').val(), $('#LocationState').val(), $('#channelName').html());
        }
        else if ($('#territoryName').html() != "") {
            $('#channelName').html() = "";
        }
    });