Загрузка дополнительных сообщений не работает

Я добавляю функцию LoadMore для добавления дополнительных сообщений в зависимости от длины отображаемых сообщений и итоговых сообщений в DOM. Проблема, с которой я столкнулась, заключается в том, когда я консоль регистрирую listofposts, и я проверяю элемент в Google Chrome, я вижу, что длина показывает нуль (0). Я точно не знаю, где я поступил неправильно или если у меня было правильно, или я должен отделить две функции, сначала загрузив первые 4 сообщения, а затем создайте новую функцию, отдельную для обработки добавления?

$(document).on('pagebeforeshow', '#blogposts', function() {     
    //$.mobile.showPageLoadingMsg();    
        $.ajax({
            url: "http://howtodeployit.com/category/daily-devotion/?json=recentstories&callback=",
            dataType: "json",
            jsonpCallback: 'successCallback',
            async: true,
            beforeSend: function() { $.mobile.showPageLoadingMsg(true); },
            complete: function() { $.mobile.hidePageLoadingMsg(); },
            success:function(data){

            var $listofposts = $('data');
            console.log($listofposts);
            var $loadMore = $listofposts.parent().find('.load-more');
           //   console.log($loadMore);

            currentPage = 0;
            postsPerPage = 4;

            var showMorePosts = function () {

                $offset = currentPage * postsPerPage, //initial value is 0

                    posts = data.posts.slice($offset, $offset + postsPerPage);
                    console.log(posts);
                    $.each(posts, function(i, val) {
                    //console.log(val);
                    $("#postlist").html();
                    var result = $('<li/>').append([$("<h3>", {html: val.title}),$("<p>", {html: val.excerpt})]).wrapInner('<a href="#devotionpost" onclick="showPost(' + val.id + ')"></a>');
                    $('#postlist').append(result);
                    console.log(result);
                    });

                    if(posts.length !== postsPerPage){
                        alert ('True');
                        $loadMore.hide();
                    }

                    currentPage++;
                    $("#postlist").listview();
                    $("#postlist").listview('refresh');
                    }

                    showMorePosts();
                    $loadMore.on('click', showMorePosts);

                }});