Как настроить плагин jQuery для порционной загрузки фото?

Добрый день! Прошу помочь. Есть сайт со скриптом, позволяющим постепенно «загружать» фотографии путем нажатия на кнопку «Больше фото». Осуществляется это посредством кода, который приведён ниже.

Проблема в том, что загружаются сразу все фото, перечисленные в items. А мне нужно, чтобы они загружались определёнными порциями. Например, сначала 3 фото. Потом при нажатии на кнопку загружаются следующие фото и так далее.

Здесь же только первые 4. А, если в items их больше заданного количества, то скрипт зацикливается и при каждом нажатии на «Больше фото» выдает первые 4, потом снова первые 4 и так далее.

Прошу, пожалуйста, помогите, посоветуйте, что сделать или как указать, чтобы фото грузились поочередно партиями, например, по 4.

jQuery(window).load(function() {
  items_set = [
    { category: 'bar', lika_count: '77', view_count: '234', src: 'foto/bar/bar52.jpg', title: 'Foil Mini Badges', content: '' },
    { category: 'bar', lika_count: '45', view_count: '100', src: 'foto/bar/bar53.jpg', title: 'Darko – Business Card Mock Up', content: '' },
    { category: 'bar', lika_count: '77', view_count: '234', src: 'foto/bar/bar54.jpg', title: 'Foil Mini Badges', content: '' },
    { category: 'bar', lika_count: '45', view_count: '100', src: 'foto/bar/bar55.jpg', title: 'Darko – Business Card Mock Up', content: '' },
    { category: 'bar', lika_count: '77', view_count: '234', src: 'foto/bar/bar70.jpg', title: 'Foil Mini Badges', content: '' },
    { category: 'bar', lika_count: '45', view_count: '100', src: 'foto/bar/bar80.jpg', title: 'Darko – Business Card Mock Up', content: '' },
    { category: 'bar', lika_count: '22', view_count: '140', src: 'foto/bar/bar90.jpg', title: 'Woody Poster Text Effect', content: '' }
  ];
  jQuery('.portfolio_block').portfolio_addon({
    type : 1, // 2 - 4 columns simple portfolio
    load_count: 4,
    items: items_set
  });
  $('#container').isotope({
    animationOptions: {
      duration: 900,
      queue: false
    }
  });
});

<div class="container">
    <!-- Контейнер, в который будем загружать изображения -->
    <div class="row images"></div>
    <!-- Кнопка для подгрузки изображений -->
    <button class="more-image">Показать ещё</button> 
</div>

<script>
(function($) {
    $(function() {
        var step = 4;
        var current = 0;
        var items_set = [
            {src : 'foto/bar/bar52.jpg', title : 'Foil Mini Badges'},
            {src : 'foto/bar/bar53.jpg', title : 'Darko – Business Card Mock Up'},
            {src : 'foto/bar/bar54.jpg', title : 'Foil Mini Badges'},
            {src : 'foto/bar/bar55.jpg', title : 'Darko – Business Card Mock Up'},
            {src : 'foto/bar/bar70.jpg', title : 'Foil Mini Badges'},
            {src : 'foto/bar/bar80.jpg', title : 'Darko – Business Card Mock Up'},
            {src : 'foto/bar/bar90.jpg', title : 'Woody Poster Text Effect'}
        ];
        var max = items_set.length-1;
        $('.more-image').click(function(){
            for (var i=0; i<step; i++) {
                if (current > max) {
                    $(this).hide();
                    break;
                }
                $('.images').append(
                    '<div class="col-md-3">' +
                        '<img class="img-responsive" src="' + items_set[current].src + '" alt="' + items_set[current].title + '">' +
                    '</div>');
                current++;					
            }       
        });
	$('.more-image').triggerHandler('click');
    });
})(jQuery);
</script>