Question

I am having problem with my jquery code, I am trying to state that if “Yes” button is on, disable the “No” button, else if the “No” button is on, then disable the “Yes” button, else enable both buttons.

But at the moment do button is being disabled when the other button is turned on, does anyone know why this is?

Below is code:

function btnclick(btn)
{
    var context = $(btn).parents('#optionAndAnswer');
    if (context.length == 0) {
        context = $(btn).parents('tr');
    }

$(btn).toggleClass("answerBtnsOff");
$(btn).toggleClass("answerBtnsOn");

    if ($("#answerYes", context).hasClass('.answerBtnsOn')) {
        $("#answerNo", context).attr("disabled", "disabled");
    }

    else if ($("#answerNo", context).hasClass('.answerBtnsOn')) {
        $("#answerYes", context).attr("disabled", "disabled");
    }

    else {
    $("#answerYes", context).removeAttr("disabled");
    $("#answerNo", context).removeAttr("disabled");
    }


    return false;
}

below is html for both yes and no buttons:

Yes button:

<input class="answerBtns answers answerBtnsOff" name="answerYesName"   id="answerYes"   type="button"   value="Yes"     onclick="btnclick(this);"/>

No Button:

<input class="answerBtns answers answerBtnsOff" name="answerNoName"    id="answerNo"        type="button"   value="No"      onclick="btnclick(this);"/>

Answer 1

You dont put the . in toggleClass/hasClass/removeClass/… you only use them in selectors