Absolute and Relative HTML div positioning using jQuery

Lets say you have multiple HTML div elements to be absolute positioned under another div element, then you need to make parent div positioned as relative and then the child div elements to be positioned as absolute. You can change the other css attributes as well using jQuery on child div elements.

 var parentDiv = $("#parent");  
 parentDiv.css({  
   "position" : "relative",  
   "height" : "100px",  
   "width" : "200px"   
 });  
   
 var childDiv = $("<div></div>").appendTo(parentDiv);  
 childDiv.prop("id","child");  
 childDiv.css({  
   "position" : "absolute",  
   "height" : "50px",  
   "width" : "50px",  
   "top" : "10px",  
   "left" : "10px"  
 });  

Now the child div element is placed under absolutely within the parent div according to the css properties of top, left, right, bottom. You can have any number of child div elements positioned like this  and change the positioning properties accordingly.