Add a 'show more' and 'show less' section to page

I've previously tired to use this code (below) to add a show more and show less feature to this page, initially showing 9 images and then revelling 9 more and so on. However, it doesn't appear to work when I use #expand-5 as this tutorial shows 

It only appears to show items that are more than 5 rows down and its not clean. Any tips?

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script> var SHOW_MORE = 'Show More' var COLLAPSE = 'Show Less' $(window).load(function(){ $('a[href^="#expand"]').each(function(){ var n = parseInt($(this).attr('href').split('-')[1]); var next_n_divs = $(this).parents('div.sqs-block').nextAll().slice(0,n) next_n_divs.wrapAll('<div class="extra-gallery" style="display:none;"></div>'); $(this).click(function(){ var target_gallery = $(this).parents('div.sqs-block').next('div.extra-gallery') if (target_gallery.is(':visible')){ $(this).text(SHOW_MORE); } else { $(this).text(COLLAPSE); } target_gallery.slideToggle(); return false; }); }); }); </script> 

Hi,

Can you share link to page where you have problem?