Dynamic content not loading on mobile

This is the page having an issue: http://f6d.28a.myftpupload.com/blog/

All posts on this page are loaded are using a jquery.

The page is working fine on desktop, even on firefox if I test page using ctrl+shift+m for page is working properly.

But when I open this page on my iphone 5s, iOS 8.2, No posts are loading.

Code through which those post are loaded is as below:

jQuery(function($){
var $grid = $('.post-area').masonry({
      itemSelector: '.post-area .box',
    });
var page = 1;
var loading = true;
var $window = $(window);
var $content = $("body #main");
var load_posts = function( cat = $("input[name='cat_id']").val(), year = '', orderby = '' ){
        if((cat != '' || year != '' || orderby != '') &&  page == 1){
            $content.html('');
            $content.append('<div id="temp_load" style="text-align:center">
                        <img src="http://f6d.28a.myftpupload.com/wp-content/themes/bob/images/ajax-loader.png" />
                        </div>');
        }

        $.ajax({
            type       : "GET",
            data       : {numPosts : 1, pageNumber: page, cat: cat, year: year, orderby: orderby},
            dataType   : "html",
            url        : "http://f6d.28a.myftpupload.com/wp-content/themes/bob/template-parts/loopHandler.php",
            beforeSend : function(){
                if(page != 1){
                    $content.append('<div id="temp_load" style="text-align:center; bottom: 0; left: 0; position: absolute; right: 0;">
                        <img src="http://f6d.28a.myftpupload.com/wp-content/themes/bob/images/ajax-loader.png" />
                        </div>');
                }
            },
            success    : function(data){

                $data = $(data);
                if($data.length){
                    $data.hide();
                    $content.append($data);
                    $grid.append( $data ).masonry( 'appended', $data );
                    $grid.masonry( 'reloadItems' );
                    $grid.masonry( 'layout' ); 
                    $data.fadeIn(500, function(){
                        $("#temp_load").remove();
                        loading = false;
                    });
                } else {
                    $("#temp_load").remove();
                }
            },
            error     : function(jqXHR, textStatus, errorThrown) {
                $("#temp_load").remove();
                alert(jqXHR + " :: " + textStatus + " :: " + errorThrown);
            }
    });
}
$window.scroll(function() {
    var content_offset = $content.offset();
    console.log(content_offset.top);
    if(!loading && ($window.scrollTop() +
        $window.height()) > ($content.scrollTop() + $content.height() + content_offset.top)) {
            loading = true;
            var cat = $('select[name="cat"]').val();
            var year = $('select[name="year"]').val();
            var orderby = $('select[name="orderby"]').val();
            page++;
            load_posts( cat, year, orderby );
    }
});
$('select[name="cat"]').on('change', function() {
    var cat = $(this).val();
    var year = $('select[name="year"]').val();
    var orderby = $('select[name="orderby"]').val();
    page = 1;
    load_posts(cat, year, orderby);
});

$('select[name="year"]').on('change', function() {
    var year = $(this).val();
    var cat = $('select[name="cat"]').val();
    var orderby = $('select[name="orderby"]').val();
    page = 1;
    load_posts(cat, year, orderby);
});

$('select[name="orderby"]').on('change', function() {
    var orderby = $(this).val();
    var cat = $('select[name="cat"]').val();
    var year = $('select[name="year"]').val();
    page = 1;
    load_posts(cat, year, orderby);
});

load_posts();
});

Can some please guide me on this….