JSFiddle - React, Tailwind, and code Playground

by Alexis LĂłpez Espinoza

HTML

<div></div>

CSS

html, body{
	width: 100%;
	height: 100%;
}

div{
	width: 10%;
	height: 10%;
	border: .1rem black solid;
}

JavaScript

$("div").on("click", function(){
	$(this).toggleClass("clase");
	if ($(this).hasClass("clase")){
		$(this).css("background", "red");
	}
	else{
		$(this).css("background", "white");
	}
}).hover(function(){
	if (!$(this).hasClass("clase")){
		$(this).css("background", "black");
	}
}, function(){
	if (!$(this).hasClass("clase")){
		$(this).css("background", "white");
	}
});