<div id="gameContent">
  </div>
#gameContent{display:block; margin:auto; text-align:center;}
#gameContent label{
   background:black;
   width:50px;
   height:50px;
   margin:5px;
   display:inline-block;
  float:none;
}
#gameContent label.active{
  background-color:green;
}
#gameContent label.active.error{
  background-color:red;
}
$(document).ready(function(){
  
  for ($y=1; $y<=6; $y++){
var appendHTML="<div class='row'>";
    var randomX=Math.floor(Math.random() * 6) + 1;
    for (var $x=1;$x<=6;$x++){
      var errorClass="";
         if ($x==randomX){
           errorClass=" class='error' ";
         }
      appendHTML +="<label "+errorClass+"></label>";
    }//x for
    appendHTML +="</div>";
    $("#gameContent").append(appendHTML);
  }//y for
         
  $("#gameContent label").click(function(){
    $(this).addClass("active");
  });
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. //cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.min.js