JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<div class="projects">ONE</div>
<div class="other-things">TWO</div>
<div class="about">THREE</div>

CSS

body {font-size:21px; font-family:arial;}
.projects{text-align:center; line-height:100vh;background:#99c6c3;	overflow-x: hidden;width: 33%;float:left; height: 100vh;}	
.other-things{text-align:center; line-height:100vh;background:#d3d3d3;overflow-x: hidden;width: 33%;float:left; height: 100vh;}
.about {text-align:center; line-height:100vh;background: #eedd8d;	overflow-x: hidden;width: 33%;float:left; height: 100vh;}

JavaScript

var bgcolorlist=new Array("#99c6c3", "#d3d3d3", "#eedd8d")
$(".projects").css("background-color",bgcolorlist[Math.floor(Math.random()*bgcolorlist.length)]);

var bgcolorlist=new Array("#99c6c3", "#d3d3d3", "#eedd8d")
$(".about").css("background-color",bgcolorlist[Math.floor(Math.random()*bgcolorlist.length)]);

var bgcolorlist=new Array("#99c6c3", "#d3d3d3", "#eedd8d")
$(".other-things").css("background-color",bgcolorlist[Math.floor(Math.random()*bgcolorlist.length)]);