JSFiddle - React, Tailwind, and code Playground

HTML

<div id="rightWrongContainer">
        <div id="q1" class="rightWrong"></div>
        <div id="q2" class="rightWrong"></div>
        <div id="q3" class="rightWrong"></div>
        <div id="q4" class="rightWrong"></div>
        <div id="q5" class="rightWrong"></div>
        <div id="q6" class="rightWrong"></div>
        <div id="q7" class="rightWrong"></div>
        <div id="q8" class="rightWrong"></div>
        <div id="q9" class="rightWrong"></div>
        <div id="q10" class="rightWrong"></div>
    </div>

CSS

.rightWrong {
  height: 10px;
  width: 10px;
}

JavaScript

var elems = document.getElementById("rightWrongContainer").children
console.log(elems);

for (var i = 0; i < elems.length; i++) {
	if ((i%2) === 0) {
  	document.getElementById(elems[i].id).style.backgroundColor = "green";
  } else {
  	document.getElementById(elems[i].id).style.backgroundColor = "red";
  }
}