JSFiddle - React, Tailwind, and code Playground
HTML
<div id="wrapper">
<img src="http://placehold.it/300x200" class="hover" />
<p class="text">text</p>
</div>
CSS
#wrapper p {
position:relative;
bottom:30px;
left:0px;
visibility:hidden;
}
JavaScript
$('.hover').mouseover(function() {
$('.text').css("visibility","visible");
});
$('.hover').mouseout(function() {
$('.text').css("visibility","hidden");
});