Question

I have a piece of code below where it contains 26 buttons from A-Z. Each button can be turned on and turned off.

<?php
    $a = range("A","Z");
?>

<?php
        $i = 1;
        foreach($a as $key => $val){
            if($i%7 == 1) echo"<tr><td>";
            echo"<input type=\"button\" onclick=\"btnclick(this);\" value=\"$val\" id=\"answer".$val."\" name=\"answer".$val."Name\" class=\"answerBtns answers answerBtnsOff\">";      
            if($i%7 == 0) echo"</td></tr>";
            $i++;
        }
    ?>

Below is the code where I am trying to turn on and off the correct buttons but the problem is that it is not turning off the buttons it should be turning off.

var answers = '#answer'+btn;
$('.answers.answerBtnsOn').find('answerBtnsOn').addClass('answerBtnsOff');

Now if I change the last line of code to code below:

$('.answerBtnsOn').find('answerBtnsOn').addClass('answerBtnsOff');

then it works but the problem is that all my buttons have the class “.answerBtnsOn”, I only want the buttons within the “answers” variable to be turned off when it should be. So how can I turn off buttons within the “answers” variable?

Answer 1

If you only want buttons inside answers, then pass that as the context to $().

$('.answerBtnsOn', answers).addClass('answerBtnsOff');