javascript - JavaScript または jQuery を使用して、ラジオ ボタンの選択が配列内の項目と一致するかどうかを確認する

Question

この時点で、選択したラジオ ボタンを配列内の正解と比較できるかどうかをテストしています。以下のコメントを参照してください。

var allQuestions = [{
        "question": "Who was Luke's wingman in the battle at Hoth?",
        "choices": ["Dak", "Biggs", "Wedge", "fx-7"],
        "correctAnswer": 0
    }];


function answerFwd() {
    var answerOutput = " ";
    var itemAnswers = allQuestions;
    var answer = 0;
    var playerTally = 0;
    var playerFeedback = "";
    var playerMessage = document.getElementById("playerMessage");


    // Is this the correct way to store the radio button which is selected?
    var radioValue = $("input[type='radio'].radioButtons").is(':checked');

    var right = false;

    if (currentAnswer <= itemAnswers.length) {
        currentAnswer++;
    }

    createRadioButtonFromArray(itemAnswers[currentQuestion].choices);

    //Then compare value in array with radioValue value
    if(radioValue == itemAnswers.correctAnswer){
          right = true;
    }           

    if(right) {
        alert("You answered correctly");
    } else {
        alert("Wrong answer");
    }

}

私の間違いは、正しいものと比較correctAnswer:3していないことだと思います。radioValue意味のあるのは、値と一致するボタンのインデックスです。for-loop最善の方法でしょうか？前もって感謝します！

アップデート

ボタンを作成するコードは次のとおりです。

 function createRadioButtonFromArray(array) {
   var len = array.length; 
   var responses = document.getElementById("responses"); 
   responses.innerHTML = ''; 
    for (var i = 0; i < len; i++) {
     radio = document.createElement("input"); 
     radio.type = "radio";
     radio.name = "choices"; 
     radio.className = "radioButtons"; 
     radio.value = i; 
     radio.id = "choice" + i; 
     var radioText = document.createElement("div"); 
     radioText.id = "c" + i; 
     radioText.className = "choiceText"; 
     radioText.innerHTML = array[i]; 
     responses.appendChild(radio); 
     responses.appendChild(radioText); 
   }
}

そして、これがどのようにレンダリングされるか：

<div id="responses">
<input type="radio" name="choices" class="radioButtons" value="0" id="choice0">
<div id="c0" class="choiceText">The Avenger</div>
<input type="radio" name="choices" class="radioButtons" value="1" id="choice1">
<div id="c1" class="choiceText">Devastator </div>
<input type="radio" name="choices" class="radioButtons" value="2" id="choice2">
<div id="c2" class="choiceText">Conquest</div>
<input type="radio" name="choices" class="radioButtons" value="3" id="choice3">
<div id="c3" class="choiceText">The Executor</div>