Wrap a bunch of images with links

1 Views

I have a wordpress menu like this 

<?php wp_nav_menu(
      array(
       'menu' => 'Property Menu', 
       'after' => '<img src="'.get_stylesheet_directory_uri().'/images/btn.png" class="button-img">' 
    )); ?>

I want to wrap that image after each menu item with the menu link. So far I have the following, but it is using the first menu item link for all images:

Read More
<script type="text/javascript">
$(document).ready(function() {
  $('.button-img').wrap('<a href="' + $('.button-img').parent().children().first().attr('href') + '" />');
});
</script>

Thank you in advance.

Post Views: 1

Related posts

Leave a Reply

1 comment

  1. Pass a function and then you can use $(this) to refer to the current element in the set. That will prevent it from applying to all images on each iteration.

    $('.button-img').wrap(function(){
    return '<a href="' + $(this).parent().children().first().attr('href') + '" />';
});