JSFiddle - React, Tailwind, and code Playground

HTML

<a class="item show" href="#">
    <img class="image" width="180" height="180" alt="" src="//placehold.it/140x140" />
<p class="title">TEST POST 1</p>
<p class="year">2013</p>
<p class="cat">category</p>
</a>

JavaScript

$(document).ready(function () {

    $('.show').each(function () {
        $(this).animate({
            opacity: '0.0'
        }, 1);
        $(this).mouseover(function () {
            $(this).stop().animate({
                opacity: '1.0'
            }, 600);
        });
        $(this).mouseout(function () {
            $(this).stop().animate({
                opacity: '0.0'
            }, 300);
        });

    });
});