title: Highlight Specific Button Upon Page Load
body: <p>I'm building a quiz app, and for a certain part of it I would like for some of the answers to be highlighted upon loading of the page.</p>
  
  <p>These are the buttons:</p>
  
  <pre><code>&lt;input type="hidden" name="correct_answer" value="&lt;?php echo (isset($correct_answer)) ?   $correct_answer : 'no corect answer';?&gt;"&gt;
  &lt;button name="answer" value="A" class="btn btn-primary btn-lg"&gt;A&lt;/button&gt;
  &lt;button name="answer" value="B" class="btn btn-primary btn-lg"&gt;B&lt;/button&gt;
  &lt;button name="answer" value="C" class="btn btn-primary btn-lg"&gt;C&lt;/button&gt;
  &lt;button name="answer" value="D" class="btn btn-primary btn-lg"&gt;D&lt;/button&gt;
  &lt;button name="answer" value="E" class="btn btn-primary btn-lg"&gt;E&lt;/button&gt;
  </code></pre>
  
  <p>You can see I'm loading a hidden element with the correct answer inside it.</p>
  
  <p>All the back end works just fine, But I can't seem to figure out how to do this.</p>
  
  <p>Is it possible to do this in native JS or is jQuery a must?
  Also, how do I go about doing this? How do I make sure the CSS class is added to the right element?</p>
  
  <p><strong>EDIT:</strong></p>
  
  <p>This is the code I ended up using:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  document.getElementById("&lt;?php echo $correct_answer;?&gt;").style.backgroundColor = "green";
  &lt;/script&gt;
  </code></pre>