Проблема с условием для цикла for

Необходимо, чтобы после нажатия на кликабельный div элементы label закрашивались в зелёный цвет если их value равны вопросыОсновнойМассив[НомерТекущегоВопроса]['правильныйОтвет'].

const вопросыОсновнойМассив = [
{варианты: ["Первый", "Второй", "Третий", "Четвёртый",],
правильныйОтвет: 4, },
{vopros: "Какой собаке была поставлена статуя в Центральном парке Нью-Йорка?",
варианты: ["Пятый", "Шестой", "Седьмой", "Восьмой",],
правильныйОтвет: 2,}]

let НомерТекущегоВопроса=0;
document.querySelector('.варики').innerHTML = '';
let номерВарика =1;
    for (ОдинОтвет of вопросыОсновнойМассив[НомерТекущегоВопроса]['варианты']) {
        const тестоДляОтвета = `<label><input value="%number%" type="radio" name="cheese" id="cheese1" /><div class="текст">Варик</div></label> `.replace('Варик', ОдинОтвет).replace('%number%', номерВарика);
    document.querySelector('.варики').innerHTML += тестоДляОтвета.replace('Варик', ОдинОтвет);
    номерВарика++;}
  
  
document.querySelector('.ответить').onclick = function проверитьОтвет() {
 if (!document.querySelector('.варики').querySelector('input[type="radio"]:checked')){ // Выбрал ли пользователь один из вариков
    document.querySelector('.ответить').blur(); 
    return};
//Вот этот идиотский цикл
for (var i = 1; parseInt(document.querySelector('.варики').querySelector('input[type="radio"]')[i].value) != вопросыОсновнойМассив[НомерТекущегоВопроса]['правильныйОтвет']; i++) {
    document.querySelector('label')[i].style.backgroundColor = 'green'; 
    }
}
.ответить, label {
    height: 10vh;
      width: 20vw;
     color: #F0E68C;
     background: #800000;
     margin: 1.2vh auto;
     border: 4px solid #F0E68C;
     border-radius: 5vh;
     position: relative; 
     display: flex;
     justify-content: center;
     align-items: center;
     cursor: pointer; 
     overflow: hidden;
  } 
    .варики {
   width: 50vw; 
    flex-wrap: wrap; 
    display: flex; 
    align-content: flex-start;   
    margin-left: auto; 
    margin-right: auto; 
}
<div class="варики"> 
      <label> 
        <input value="%number%" type="radio" name="cheese" id="cheese1" /><div class="текст">Варик</div>
      </label> 
      <label>  
        <input value="%number%" type="radio" name="cheese" id="cheese1" /><div class="текст">Варик</div>
     </label>   
     <label> 
      <input value="%number%" type="radio" name="cheese" id="cheese1" /><div class="текст">Варик</div>
     </label> 
     <label> 
      <input value="%number%" type="radio" name="cheese" id="cheese1" /><div class="текст">Варик</div>
     </label> 
   </div>
   <div class="ответить"><p class="текст">Ответить</p></div>


Ответы (0 шт):