JSFiddle - React, Tailwind, and code Playground

by rodrigorf

HTML

<div id="ceu" >  
</div>

CSS

.lote{
    border: 1px dashed black;
    width:100px;
    height:100px;
    vertical-align:middle;
    text-align:center;
    line-height:100px;
    float:left;
}

.lote:hover {
    background-color: red; /*#4679bd;*/
    color:white;
}

JavaScript

for (var i = 1; i <= 100; i++) {
    var elm = '<div id="' + i + '" class="lote"> ' +
              'VENDE-SE'+
              '</div>';
    $(elm).appendTo('#ceu');
 }

$(".lote").click(function(){
    alert('LOTE:'+ $(this).attr('id'));
     return false;
});