JSFiddle - React, Tailwind, and code Playground

by telizpablo

HTML

<td id="table1" height="351" valign="top" align="center">
   <div class="fundo " data-color="black">preto</div>
   <div class="fundo" data-color="blue">azul</div>
   <div class="fundo" data-color="yellow"> amarelo</div>
   <div class="fundo" data-color="green"> verde</div>
   <div class="fundo"> </div> 
</td> 

<div class="table2">
  table 2
</div>

CSS

.fundo {
   font-size: 1em; 
   text-align: center; 
   line-height: 40px; 
   height: 52px; 
   width: 52px; 
   margin: 4px; 
   margin-left:32px; 
   border: 2px solid black; 
   float: left; 
   padding: 2px;
 }

JavaScript

$(".fundo" ).click(function() {
		var color = $(this).data('color');
   	$('.table2').css('background-color', color);
});