Wordpressで、ajaxでの外部ファイル読み込み時の不具合

Wordpressで、カスタム投稿タイプの投稿ごとに、別々の外部ファイルを、以下のように読み込む必要があるため、

■読み込み側サイト1の外部ファイル

https://*****.com/wp-content/themes/****/inc-file.php

【出力結果】

例)
投稿1に表示させるコンテンツ

■読み込み側サイト2の外部ファイル

https://*****.com/wp-content/themes/****/inc-file.php

【出力結果】

例)
投稿2に表示させるコンテンツ

　↓

■表示側サイト

カスタム投稿タイプ　投稿一覧

【投稿1】
投稿1に表示させるコンテンツ

【投稿2】
投稿2に表示させるコンテンツ
・
・
・

foreachのループ内で、以下のように記述しました。

■wp_remote_getで外部ファイル取得

<?php $url = 'wp-content/themes/****/inc-file.php'; if(get_field('num') == 1) { $inc_file = wp_remote_get($url); echo wp_remote_retrieve_body($inc_file); } ?>

　　　↓

外部ファイルの読み込みには成功するが、
100件以上の外部ファイルを読み込むため、データの読み込みが完了するまで、
サイトが何も表示されない状態になってしまう。

なので、ajaxにしたのが、以下です。

■jquery.ajaxで外部ファイル取得

<?php $url = 'wp-content/themes/****/inc-file.php'; ?> <script type="text/javascript"> $(function() { var $loading = $(".loading"); var def = $.ajax({ url:'<?=$url?>', dataType:"html", beforeSend:function(){ $loading.removeClass("is-hide"); } }); setTimeout(function(){ $.when(def).done(function(data){ $loading.addClass("is-hide"); $('.ajax_content').append(data); //console.log($url); }); },1000); }); </script> <div class="ajax_content"></div>　//表示用class

　↓

テストしたところ、ループ外であれば、外部ファイルの読み込みには成功するが、
ループ内で実行すると、

【投稿1】
投稿1に表示させるコンテンツ
投稿1に表示させるコンテンツ
投稿1に表示させるコンテンツ
投稿1に表示させるコンテンツ
投稿1に表示させるコンテンツ

【投稿2】
投稿2に表示させるコンテンツ
投稿2に表示させるコンテンツ
投稿2に表示させるコンテンツ
投稿2に表示させるコンテンツ
投稿2に表示させるコンテンツ

のように、同じ内容をループで表示し続けてしまいます。

表示用の「.ajax_content」が、すべての投稿で同じclassになってしまうので、
ここを、投稿ごとに動的に変化するようにする必要もあると思いますが、
そもそも、根本的に何かが間違っているのでしょうか。
プログラムはほぼ初心者です。