JSFiddle - React, Tailwind, and code Playground
HTML
<div class="all_names">
<span class="name" data-name="1">Steve</span>
<span class="name" data-name="2">Mike</span>
<span class="name" data-name="3">Sean</span>
<span class="name" data-name="4">Emily</span>
</div>
<div class="show_names"></div>
CSS
.image {
position: relative;
width: 287px;
height: 200px;
}
.image-one {
position: relative;
width: 231px;
height: 200px;
}
JavaScript
jQuery(".all_names").click(function(){
jQuery( "span.name" ).each(function( index ) {
var html = '<div class="show" id="'+ jQuery(this).data("name")+ '">'+ jQuery(this).text()+ '</div>';
$( "div.show_names" ).append(html);
});
})