Rails6 無限スクロール　スマホだと動かない

jscrollで無限スクロールを実装しているのですが、

PCだと読み込まれるのが、スマホ版にするとうまく読み込まれません。

試しに、ページの下部10%になった読み込むようにすればうまくいくかなと思い、やってみたのですが、

こちらもうまくいきませんでした。

jscroll.js
1$(document).on('scroll', function() {
2    scrollHeight = $(document).height();
3    scrollPosition = $(window).height() + $(window).scrollTop();
4    if ( (scrollHeight - scrollPosition) / scrollHeight <= 0.1) {
5            var jscrollOption = {
6                // callback: true,
7                loadingHtml: '<div class="loading"><img src="/assets/Preloader_1.gif" alt="Loading" /> Loading...</div>', 
8                autoTrigger: true, 
9                padding: 20,
10                nextSelector: 'span.next:last a', 
11                contentSelector:' .ex-con'
12            }
13            $('.f-container').jscroll(jscrollOption);
14        
15    }
16});
17

上手くいく場合class="pagination"の下にclass="jscroll-added"が追加されてその下にclass="f-item"が続きます。

スマホではclass="jscroll-added"追加されない。

そもそもjscroll.jsがpcだと上手く読み込まれて、スマホでは読み込まれてもいないです(class="jscroll-inner"がスマホでは追加されていない。)。

PCでは動いてスマホでは動かないといった場合は、どのような問題が考えられるのでしょうか？

教えて頂けると幸いです。

$(window).on('load', function() {
    scrollHeight = $(document).height();
    scrollPosition = $(window).height() + $(window).scrollTop();
    if ( (scrollHeight - scrollPosition) / scrollHeight <= 0.1) {
            var jscrollOption = {
                // callback: true,
                loadingHtml: '<div class="loading"><img src="/assets/Preloader_1.gif" alt="Loading" /> Loading...</div>', // 記事読み込み中の表示、画像等をHTML要素で指定することも可能
                autoTrigger: true, 
                padding: 20,
                nextSelector: 'span.next:last a', 
                contentSelector:' .ex-con'
            }
            $('.f-container').jscroll(jscrollOption);
        

    }
});

$(window).on('load', function() にすればスマホでもclass="jscroll-inner"は追加（jscroll.jsは読み込まれた）されましたが、

class="jscroll-added"は追加されませんでした。