jQuery Iteration with WordPress Feed

I’m building a work portfolio using a WordPress category feed and jQuery to show some effects when you hover over a portfolio example. I would like to iterate using jQuery and a WordPress feed so the effect works for each of my portfolio examples… I have successfully done this for the first example in my portfolio, however getting it to work on each portfolio example is proving challenging. I understand each portfolio example needs a unique identifier but I don’t understand how to apply it to each one. Please see the code below thank you for helping me

JS:

$(document).ready(function() {
  $('div.recentWork').hover(function(){
     $(".links").stop(1).slideDown();
         $(".imagio").fadeOut();
  },function(){
     $(".links").stop(1).slideUp();
         $(".imagio").fadeIn();
  });
});

PHP:

<?php if ( have_posts() ) while ( have_posts() ) : the_post(); ?>

    <?php

    if(has_post_thumbnail($post->ID)){
        $thumbsrc = get_the_post_thumbnail($post->ID,'medium');
    }else{
        $thumbsrc = "<img src="images/no_featured_image.jpg" style="width:100%;height:180px;">";
    }

    $url = get_post_meta($post->ID, "URL", true);
    $website = get_post_meta($post->ID, "Website", true);      

    ?>

    <div class="recentWork">

        <div class="links">
        <a href="<?php echo $website; ?>" target="_blank"><img src="<?php bloginfo('url'); ?>/images/icons/icon_zoom.png" /></a><a href="<?php echo $website; ?>"><img src="<?php bloginfo('url'); ?>/images/icons/icon_more.png" /></a><br />
        <?php the_title(); ?>
        </div>

        <div class="imagio">
        <?php echo $thumbsrc; ?>
        </div>

    </div>

<?php endwhile; ?>