JSFiddle - React, Tailwind, and code Playground

by Daniel Hall

HTML

<h1>
Find The right Button 3 trys
<div id="body2"></div>
<button>
</button>

<button>
</button>
<button>
</button>
<button>
</button>
<button id="replaceButton"></button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<h1>
level2 2 trys!
</h1>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button id="wooButton"></button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<div id="body"></div>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<h1>
End of the game level and one try
</h1>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button>
</button>
<button id="elButton"></button>
<button>
</button>
<button>
</button>
<button>
</button>

CSS

body {
    font-family: "Comic Sans MS";
		background-color: #AAF02F;
}
p {
	  font-size: 0em;
}

#body {
	  position: absolute;
		left: 40%;
		width: 30%;
		height: 30%;
		top: 70%;
		background-color:#AAF02F;
}

#body2 {
	    position: absolute;
			left: 15%;
			top: 70%;
			width: 30%;
			height: 30%;
			background-color: #AAF02F;
}

JavaScript

var replaceButton = document
   .getElementById("replaceButton");
replaceButton.addEventListener("click",replaceIt);

function replaceIt(){
   document.getElementById("body2")
	 .style.backgroundColor = "green";
}
var wooButton = document
   .getElementById("wooButton");
wooButton.addEventListener("click",replapeIt);

function replapeIt(){
   document.getElementById("body")
	 .style.backgroundColor = "green";
}
var elButton = document 
   .getElementById("elButton");
elButton.addEventListener("click",replaxeIt);

function replaxeIt(){
   document.getElementById("body")
	 .style.backgroundColor = "green";
}