JSFiddle - React, Tailwind, and code Playground
HTML
<div>
<img src = "http://www.fondosblackberry.com/user-content/uploads/wall/mid/32/Paisajes_manu_peru.JPG" />
<label></label>
</div>
<div>
<img src = "http://www.fondosblackberry.com/user-content/uploads/wall/mid/16/Paisaje_de_Maldonado_en_verano.jpg" />
<label></label>
</div>
<div>
<img src = "http://www.fondosblackberry.com/user-content/uploads/wall/mid/99/Snorkel_Hawaii.jpg" />
<label></label>
</div>
CSS
div{
margin-bottom: 1.5rem;
}
label{
display: block;
color: navy;
font-size: 1.4rem;
}
img{
border-radius: .5em;
box-shadow: 0 .5em .5em;
}
JavaScript
var imagenes = document.getElementsByTagName("img"),
labels = document.getElementsByTagName("label"),
totalImg = imagenes.length;
for (i = 0; i < totalImg; i++){
var src = imagenes[i].src;
labels[i].innerHTML = src.substring(src.lastIndexOf("/") + 1, src.lastIndexOf("."));
}