JSFiddle - React, Tailwind, and code Playground

by chrimbus

HTML

<p>1) How many bits are in a byte?</p>
<div class="questions">

<div class="question">
 <div class="panel">Wrong</div>
 <div class="flip">7</div>
</div>

<div class="question">
 <div class="panel">Right</div>
 <div class="flip">8</div>
</div>

</div>

CSS

div.panel,div.flip
{
  margin:0px;
  padding:5px;
  text-align:center;
  background:#e5eecc;
  border:solid 1px #c3c3c3;
  width:140px;
}

div.panel
{
  display:none;
}
div.question
{
  float:left;
}
div.questions
{
  height: 80px;
}

JavaScript

$(document).ready(function(){
  $("button").click(function(){
    $("p").hide();
  });
});

$(document).ready(function(){
  var a = $(".question");
  a.each(function(index) {
    var flip = $(this).find(".flip");
    var panel = $(this).find(".panel");
    flip.click(function(){
      panel.slideDown("slow");
    });
  });
});