I'm building a site that contains several quizzes. To avoid redundant code, each quiz will have a javascript array to hold the answers - an answer key. I'm wanting to do all of this client-side with JS/JQuery. I need to link each quiz question with it's answer in it's corresponding answer key. Here's a snippet of 2 questions from one of the quizzes. (The .check-answer button is not a submit button because I don't want to submit anything to the server.)

Code:
<li class="group">
    <div class="question group">
        <p>What note is this?</p>
        <img src="../img/Quiz/notesOnTrebleQuiz/C5.gif" alt="3rd space from bottom" />
    </div><!-- end .question -->
    <div class="choices">
        <form data-question-id="1">
            <label>
                <input name="quizAnswer" id="notesOnTrebleQuiz_Q1A1" type="radio" value="A" />A
            </label>
            <label>
                <input name="quizAnswer" id="notesOnTrebleQuiz_Q1A2" type="radio" value="B" />B
            </label>
            <label>
                <input name="quizAnswer" id="notesOnTrebleQuiz_Q1A3" type="radio" value="C" />C
            </label>
            <label>
                <input name="quizAnswer" id="notesOnTrebleQuiz_Q1A4" type="radio" value="D" />D
            </label>
            <label>
                <input name="quizAnswer" id="notesOnTrebleQuiz_Q1A5" type="radio" value="E" />E
            </label>
            <label>
                <input name="quizAnswer" id="notesOnTrebleQuiz_Q1A6" type="radio" value="F" />F
            </label>
            <label>
                <input name="quizAnswer" id="notesOnTrebleQuiz_Q1A7" type="radio" value="G" />G
            </label>
            <a class="check-answer">check answer</a>
        </form>
    </div><!-- end .choices -->
    <div class="answer">
        <p class="correct">Correct!</p>
        <p class="incorrect">Incorrect.</p>
    </div><!-- end .answer -->
</li>
<li class="group">
    <div class="question group">
        <p>What note is this?</p>
        <img src="../img/Quiz/notesOnTrebleQuiz/F4.gif" alt="1st space on bottom" />
    </div><!-- end .question -->
    <div class="choices">
        <form data-question-id="2">
        <label>
            <input name="quizAnswer" type="radio" value="A" />A
        </label>
        <label>
            <input name="quizAnswer" type="radio" value="B" />B
        </label>
        <label>
            <input name="quizAnswer" type="radio" value="C" />C
        </label>
        <label>
            <input name="quizAnswer" type="radio" value="D" />D
        </label>
        <label>
            <input name="quizAnswer" type="radio" value="E" />E
        </label>
        <label>
            <input name="quizAnswer" type="radio" value="F" />F
        </label>
        <label>
            <input name="quizAnswer" type="radio" value="G" />G
        </label>
        <a class="check-answer">check answer</a>
        </form>
    </div><!-- end .choices -->
    <div class="answer">
        <p class="correct">Correct!</p>
        <p class="incorrect">Incorrect.</p>
    </div><!-- end .answer -->
</li>
And here's my corresponding JS code:

Code:
var notesOnTrebleAnswerKey = {
                1: 'C',
                2: 'F',
                3: 'D',
                4: 'D',
                5: 'E',
                6: 'A',
                7: 'G',
                8: 'D',
                9: 'C',
                10: 'C',
                11: 'B',
                12: 'F',
                13: 'G',
                14: 'E',
                15: 'F',
                16: 'A',
                17: 'B',
                18: 'A',
                19: 'G',
                20: 'B',
                21: 'E',
                22: 'G'
}

//when check answer, provides response
$('.check-answer').click(function(){
var getResult = $(this).find('.answer');

var answers = $(this).parent('.choices');

var question = answers.data('question-id');//may need to separate .choices from data-question-id

var answer = answers.find('input:selected').val();

var correct = $('.answer').find('.correct');
var incorrect = $('.answer').find('.incorrect');

//Notes on Treble Quiz
if(notesOnTrebleAnswerKey[question] == answer){
                getResult.find('.correct').show();
                getResult.find('.incorrect').hide();
                /*
                correct.show();
                incorrect.hide();
                */
} else {
                getResult.find('.correct').hide();
                getResult.find('.incorrect').show();
                /*
                correct.hide();
                incorrect.show();
                */
}
I can't figure out why this isn't working. Can anyone help?