Выбор ответов. которые выбрал пользователь

как сделать так, чтобы подсвечивались те ответы, которые выбрал пользователь, а остальные не подсвечивались (вне зависимости от того правильный или неправильный ответ)?

for (var i = 0; i < q.length; i++) {
                if (q[i].checked) {
                   choice = q[i].value;
                } 
                if (document.querySelector('input').value == 'value2') {
                    q[i].parentNode.style.backgroundColor = 'green';
                } else {
                    q[i].parentNode.style.backgroundColor = 'red';
                    
                }
         }

введите сюда описание изображения


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

Автор решения: Andrei

Можно реализовать возможность выделения вот таким способом:

const r = document.getElementsByName('interview');

for (let i = 0, n = r.length; i < n; ++i) {
  r[i].addEventListener('change', e => {
    for (item of r) {
      item.parentNode.removeAttribute('style');
    }
    if (r[i].checked) r[i].parentNode.setAttribute('style', 'background-color:red;');
  });
}
<form method="POST">
  <div>
    <input type="radio" id="r1" name="interview">
    <label for="r1">Разрешено</label>
  </div>
  <div>
    <input type="radio" id="r2" name="interview">
    <label for="r2">Запрещено</label>
  </div>
  <div>
    <input type="radio" id="r3" name="interview">
    <label for="r3">Затрудняюсь ответить</label>
  </div>
</form>

→ Ссылка