clickable grouped buttons

<html>
<head>
<title> http://stackoverflow.com/questions/11382453/how-to-turn-on-multiple-buttons/11382925 </title>
<style>
.answerBtnsOff { }
.answerBtnsOn { border-color:red; border-radius:2px; color:red; }
</style>

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">

<?php
    $a = range("A","Z");
    $correct = "ADEIRW";  // some string with correct letters (aka answers)
?>

    var oanswers = new Object();
    var answers = '<?php echo $correct; ?>'; // this object's attributes are named as correct letters
    for (var i=0; i<answers.length; i++) {
        oanswers[answers[i]] = true;
    }

    function btnclick(btn) {
        if (!oanswers.hasOwnProperty(btn.id[6])) {
            return;
        }
        if ($(btn).hasClass('answerBtnsOff')) {
            $('.answers').each(function(){ // turn all correct answers on
                if (oanswers.hasOwnProperty(this.id[6])) {
                    $(this).addClass('answerBtnsOn');
                    $(this).removeClass('answerBtnsOff');
                }
            });
        } else {
            $('.answers').each(function(){ // turn all correct answers off again
                if (oanswers.hasOwnProperty(this.id[6])) {
                    $(this).addClass('answerBtnsOff');
                    $(this).removeClass('answerBtnsOn');
                }
            });
        }
    }


</script>

</head>
<body>

<table id="answerSection">
    <tr>
<?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++;
    }
?>
    </tr>
</table>

</body>
</html>