title: Is there a way to add a class to all elements that has a property set to true?
body: <p>I have an object with a property of questions. questions is an array of 13 objects.Each object has a choices array that have between 2-4  objects and each object has an isCorrect property that is either true or null.</p>
  <p><a href="https://i.stack.imgur.com/hfIW0.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/hfIW0.png" alt="questions array with property choices that's also an array with objects" /></a></p>
  <p>All my questions are being rendered. I have a button that I want to add a classname to each correct answer that the user selected. Do you guys have any suggestions of how I can achieve this?</p>
  <pre><code>{quiz.questions.map((question, index) =&gt; (
     &lt;ContentWrapper key={question._key}&gt;
       &lt;h3&gt;
        {`${index + 1}. `}
        {question.title}
       &lt;/h3&gt;
       {question.choices.map(choice =&gt; (
         &lt;ChoiceStyle id={&quot;wrapper&quot; + choice._key} key={choice._key}&gt;
           &lt;input
             type=&quot;radio&quot;
             id={choice._key}
             name={question._key}
             onChange={updateScore}
             value={choice.isCorrect === null ? &quot;0&quot; : &quot;1&quot;}
              /&gt;
              &lt;label htmlFor={choice._key}&gt;{choice.title}&lt;/label&gt;
            &lt;/ChoiceStyle&gt;
          ))}
  
       &lt;ButtonComponent
          type=&quot;button&quot;
          buttonType=&quot;second&quot;
          title=&quot;Sjekk svar&quot;
          onClick={() =&gt; {
            calculateScore();
          }}
        /&gt;
  </code></pre>
  <p>That button just calculates the score but I might need to add another function to that button? I am also using styled components</p>