JSFiddle - React, Tailwind, and code Playground

HTML

<div id="player>"><img src="http://xronn.co.uk/battlearena/assets/img/charcter/ash.png"/></div>
              <div class="map" style="background-image: url('http://xronn.co.uk/battlearena/assets/img/map/map1.png')">
                <div id="1_1" class="mapsquare"></div>
                <div id="2_1" class="mapsquare"></div>
                <div id="3_1" class="mapsquare"></div>
                <div id="4_1" class="mapsquare"></div>
                <div id="5_1" class="mapsquare"></div>
                <div id="6_1" class="mapsquare"></div>
                <div id="7_1" class="mapsquare"></div>
                <div id="8_1" class="mapsquare"></div>
                <div id="9_1" class="mapsquare"></div>
                <div id="10_1" class="mapsquare"></div>
                <div id="11_1" class="mapsquare"></div>
                <div id="12_1" class="mapsquare"></div>
                <div id="13_1" class="mapsquare"></div>
                <div id="14_1" class="mapsquare"></div>
                <div id="15_1" class="mapsquare"></div>
                <div id="16_1" class="mapsquare"></div>
                <div id="17_1" class="mapsquare"></div>
                <div id="18_1" class="mapsquare"></div>
                <div id="19_1" class="mapsquare"></div>
                <div id="20_1" class="mapsquare"></div>
                <div id="21_1" class="mapsquare"></div>
                <div id="22_1" class="mapsquare"></div>
                <div id="23_1" class="mapsquare"></div>
                <div id="24_1" class="mapsquare"></div>
                <div id="25_1" class="mapsquare"></div>
                <div id="26_1" class="mapsquare"></div>
                <div id="27_1" class="mapsquare"></div>
                <div id="28_1" class="mapsquare"></div>
                <div id="29_1" class="mapsquare"></div>
                <div id="30_1" class="mapsquare"></div>
                <div id="1_2" class="mapsquare"></div>
                <div id="2_2" class="mapsquare"></div>
...

CSS

.mapsquare{
	float:left;
	height:16px;
	width:16px;
}
.player{
    z-index:10;
}
.map{
	background-repeat: no-repeat;
	width:484px;
	height:404px;
	border: 2px solid #666666;
	background-clip: initial; 
	background-origin: initial; 
	background-inline-policy: initial;
    z-index:1;
}

JavaScript

var $divs = $(".mapsquare");
$("#player").appendTo( $divs.get(Math.floor(Math.random() * $divs.length)) );