Показать еще / ajax подгрузка элементов в Битрикс

bitrix-ajax-load-elements

Создать свой шаблон компонента постраничной навигации bitrix:system.pagenavigation
<?if($arResult["NavPageCount"] > 1):?>
    <?if ($arResult["NavPageNomer"]+1 <= $arResult["nEndPage"]):?>
        <?
            $plus = $arResult["NavPageNomer"]+1;
            $url = $arResult["sUrlPathParams"] . "PAGEN_1=" . $plus
        ?>
        <div class="load_more" data-url="<?=$url?>">
            Показать еще
        </div>
    <?else:?>
        <div class="load_more">
            Загружено все
        </div>
    <?endif?>
<?endif?>
Скрипт в script.js
$(document).ready(function(){
    $(document).on('click', '.load_more', function(){
        var targetContainer = $('.loadmore_wrap'),          //  Контейнер, в котором хранятся элементы
            url =  $('.load_more').attr('data-url');    //  URL, из которого будем брать элементы
        if (url !== undefined) {
            $.ajax({
                type: 'GET',
                url: url,
                dataType: 'html',
                success: function(data){
                    //  Удаляем старую навигацию
                    $('.load_more').remove();
                    var elements = $(data).find('.loadmore_item'),  //  Ищем элементы
                        pagination = $(data).find('.load_more');//  Ищем навигацию
                    targetContainer.append(elements);   //  Добавляем посты в конец контейнера
                    targetContainer.append(pagination); //  добавляем навигацию следом
                }
            })
        }
    });
});
В шаблоне компонента списка новостей news.list до цикла задать класс обёртки loadmore_wrap
В цикле присвоить класс элементу loadmore_item
В настройках компонента выбрать вышесозданный шаблон постраничной навигации