JSFiddle - React, Tailwind, and code Playground
HTML
<ul>
<li><img src="http://kinogo.net/uploads/posts/2015-04/thumbs/1429207318_nochnoybeglez.jpg" alt=""></li>
<li><img src="http://kinogo.net/uploads/posts/2015-04/thumbs/1429207318_nochnoybeglez.jpg" alt=""></li>
<li><img src="http://kinogo.net/uploads/posts/2015-04/thumbs/1429207318_nochnoybeglez.jpg" alt=""></li>
<li><img src="http://kinogo.net/uploads/posts/2015-04/thumbs/1429207318_nochnoybeglez.jpg" alt=""></li>
</ul>
CSS
ul {
width: 250px;
margin: 20px auto;
list-style-type: none;
}
li { margin: 10px 0;}
JavaScript
$(document).ready(function(){
$('li').hover(
function() {
$(this).find('img').stop().fadeTo(500,0.1);
},
function() {
$(this).find('img').stop().fadeTo(500, 1);
}
)
});