JSFiddle - React, Tailwind, and code Playground
HTML
<div id="chess"></div>
<button id="add-piece">Add</button>
CSS
#chess .piece{
position:absolute;
background-image: url(http://bit.ly/12d8KST);
width:45px;
height:45px;
}
#chess .pawn{background-position: -56px -53px;}
#chess .rook{background-position: 0px -53px;}
JavaScript
$(function(){
var $chess = $('#chess');
var piece = '<div class="piece"></div>';
$('#add-piece').click(function(){
$(piece).addClass('pawn').css({top:50,left:50}).appendTo($chess);
$(piece).addClass('rook').css({top:200,left:200}).appendTo($chess);
});
});