jQuery - once item is clicked, grab data-item for li and apply a strike through to text in li (animate?)

I have a bunch of images that correspond to a list containing their names.When the image is clicked it fades out the image then using data-item finds its corresponding name on the list and then crosses it out in red and changes the list item word to grey. I have code but it is not working or throwing any errors in console. I am new to jQuery.

How would I connect the clicked image with the correct list name and then change the font color to grey and give it a different color (red) strike through? I'd love to animate the strike through but that may be too involved. Advice is welcome :)

Any help is appreciated!

Here is a snippet of the code:

CSS

.stroked {  text-decoration: line-through;  color: red;}.found {  color: #282828!important;}

HTML

<!--image items--><div class="picItem" data-item="Dart"><img src="Dart.png" /></div><div class="picItem" data-item="Dice"><img src="Dice.png" /></div><div class="itemWrapper"><ul class="itemList"><li class="olive">Olive</li><li class="dart">Dart</li><li class="dice">Dice</li></ul></div><!-- /itemWrapper -->

JS

 // Handle the picture item clicks$('.picItem').on('click', function () { //grab appropriate list item view data-item for strikeThrough function  strikeThrough($(this).data('item'));  $(this).fadeOut(400, function () {  });}); function strikeThrough() {     if ($('.itemList li').hasClass('stroked')) {      return;  } else {      $(this).addClass('stroked');      $(this).addClass('found');  }}