ロード直後、スライダーで複数枚表示されない。1枚のみ。

Question

前提・実現したいこと

ここに質問の内容を詳しく書いてください。
（例）PHP(CakePHP)で●●なシステムを作っています。
■■な機能を実装中に以下のエラーメッセージが発生しました。

発生している問題・エラーメッセージ

サイトロード直後、スライダーの表示が複数枚表示したいのに、一枚のみになる。
画面幅を動かす　またはスマホでスクロールなどすると複数枚表示されます。

画像枚数の認識がロード時にできていないように思いますが、設定方法がわかりません。
インスタグラムからは10枚読み込んでいます。

アドバイスお願い致します。

エラー表示なし

該当のソースコード

html

<div class="information__sliders"> <div class="swiper-container slider1"> <div id="insta-list" class="swiper-wrapper">

				</div>
				<div class="swiper-button-prev"></div>
				<div class="swiper-button-next"></div>
			</div>
		</div>

javascript
ソースコード
$.ajax({
url: url
})
.done(function(res) {
data = res.media;
limit = 9;
count = 0;
$.each(data, function(index, val) {
$.each(val, function(i, elem) {
if (elem.media_url && count < limit) {
text1 = '<li class="swiper-slide"> <a class="information__slide" href="'+elem.permalink+'" target="_blank">';
text2 = '<img src="'+elem.media_url+'">';
text3 = '</a></li>';
count ++;
text = text + text1 + text2 + text3;
}
});
});
$('#insta-list').html(text);

})
.fail(function(jqXHR, status) {
    $('#insta-list').html('<li>読み込みに失敗しました。</li>');

  })

}

試したこと

ここに問題に対して試したことを記載してください。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。