JSFiddle - React, Tailwind, and code Playground

by SpeedLogic

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<head>
<title>Test Page</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<div id="main">
    <p id="test"></p>   
</div>
</body>

CSS

#main {
    width:800px;
    height:800px;
    position:relative;
}

JavaScript

var i=0;
     mainDiv = $('#main');
     for (i=0;i<10;i++)
     {
         var x=i*10;
         $('<div class="block"></div>').appendTo(mainDiv)
                             .css({    
                                 position:'absolute', 
                                 zIndex:10,
                                 display:'none',
                                 width:30,
                                 height:30,                                
                                 left:x,
                                 top:x
                             });
     }
     var allBlocks = mainDiv.find('div'),
         testVal = allBlocks.eq(3).css('left');
     $('#test').text(testVal);