JSFiddle - React, Tailwind, and code Playground
by Korah Babu Varghese
HTML
<div id="content">
<h1>Random plaatjes</h1>
<div class="pics">
<div class="heading">
<div class="cell">
Plaatjes 1
</div>
<div class="cell">
Plaatjes 2
</div>
<div class="cell">
Plaatjes 3
</div>
<div class="cell">
Plaatjes 4
</div>
</div>
<div class="row">
<div class="cell">
Plaatje 1
</div>
<div class="cell">
Plaatje 2
</div>
<div class="cell">
Plaatje 3
</div>
<div class="cell">
Plaatje 4
</div>
</div>
<div class="row">
<div class="cell">
Plaatje 1
</div>
<div class="cell">
Plaatje 2
</div>
<div class="cell">
Plaatje 3
</div>
<div class="cell">
Plaatje 4
</div>
</div>
<div class="row">
<div class="cell">
Plaatje 1
</div>
<div class="cell">
Plaatje 2
</div>
<div class="cell">
Plaatje 3
</div>
<div class="cell">
Plaatje 4
</div>
</div>
<div class="row">
<div class="cell">
Plaatje 1
</div>
<div class="cell">
Plaatje 2
</div>
<div class="cell">
Plaatje 3
</div>
<div class="cell">
Plaatje 4
</div>
...
CSS
.cell { background: #fff; }
.cell.active { background: #efefef; }
JavaScript
var arr = [];
var allCells = $('.cell');
for(i=1;i<=5;i++)
{
var index = Math.floor(Math.random() * allCells.length);
while(arr[i]!=index)
{
alert("dfv");
}
/* if(arr[]!=index)
{
allCells.eq(index).addClass('active');
var arr[i++]=index;
}*/
}