JSFiddle - React, Tailwind, and code Playground

HTML

<div id="demo"></div>

CSS

.b {
	    width: 50px;
	    height: 50px;
	    display: inline-block;
	    border: red 1px solid;
	}

JavaScript

createLoop();
    $('.b').bind('touchmove', StartDragSelect);




function createLoop() {
    var length = 5;
    var text = "";
    var demo = $("#demo")
    for (i = 0; i < length; i++) {
        var rowElement = $('<div class="a"></div>');
        demo.append(rowElement);
        for (var x = 0; x < length; x++) {
            createGridItem(rowElement, i, x);
        }
    }
}

function createGridItem(rootElement, i, x) {
    var pix = 10;
    var currItem = $('<div class="b" id="a' + i + x + '" style="top:' + i * pix + 'px; left: ' + x * pix + 'px;  background-position-x: -' + x * pix + 'px ; background-position-y:-' + i * pix + 'px";"></div>');
    $(rootElement).append(currItem);
}



function StartDragSelect(obj) {



    obj = obj.currentTarget;

    $(obj).css({
        "background-color": "blue"
    });
}