JSFiddle - React, Tailwind, and code Playground

by redoak2000

HTML

<span class="img"></span>

    <span class="img"></span>

    <span class="img"></span>

CSS

.imgwrap {
    float: left;
    margin-right: 15px;
    border: 2px solid black;
}
.img {
    display: block;
    width: 150px;
    height: 150px;
    background-color: red;
}
.badge {
    display: block;
    width: 15px;
    height: 15px;
    background-color: blue;
    position: absolute;
}

JavaScript

$('.img').wrap('<span class="imgwrap" />');
$('.imgwrap').prepend('<span class="badge" />');