JSFiddle - React, Tailwind, and code Playground
HTML
<ul>
<li>
<img src="img/californication.jpg" data-title="Californication" class="imgCarousel" />
<p class="mostra-titulo"></p>
</li>
<li>
<img src="img/greatest-hits.jpg" data-title="Greatest Hits" class="imgCarousel" />
<p class="mostra-titulo"></p>
</li>
<li>
<img src="img/stadium-arcadium.jpg" data-title="Stadium Arcadium" class="imgCarousel" />
<p class="mostra-titulo"></p>
</li>
<li>
<img src="img/the-uplift-mofo-party-plan.jpg" data-title="The Upflit Mofo Party Plan" class="imgCarousel" />
<p class="mostra-titulo"></p>
</li>
</ul>
JavaScript
/* $(function () {
$(".flipster").flipster({
style: 'carousel',
enableTouch: true,
start: 0,
onItemSwitch: function () {
var nomeAlbum = $(this).attr("data-title");
console.log(nomeAlbum);
}
});
});**/
$('li').each(function() {
var $this = $(this);
var titulo = $this.find('img').data('title');
$this.find('.mostra-titulo').html(titulo);
});