JSFiddle - React, Tailwind, and code Playground

HTML

<div class="insertText"></div>

CSS

/*
使い方

pc.htmlとmobile.htmlを子テーマlibフォルダに作る。
libフォルダがない場合は新たに作る。
pc(mobile).htmlの中身は普通にその部分のhtmlを書く。

例) <p>pc用テキスト</p>

記事中の任意の場所にhtml欄のようにタグを入れる
このclassは任意のものに変えられる。
変えた場合は、javascript欄の「設定するセレクタ」部分にcssと同様にクラスを書く。
クラスの場合、先頭のピリオドを忘れずに。

*/

JavaScript

(function($) {
  //設定するセレクタ(class or ID)
  var insertSelector = ".insertText";

  //テーマまでのパスとファイル
  var siteChildTheme = "./wp-content/themes/simplicity2-child/lib/",
			pcFile = siteChildTheme + "pc.html",
			mobileFile = siteChildTheme + "mobile.html";

  //モバイルチェック用関数
  function is_mobile() {
    var pattern = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i;
    var UA = navigator.userAgent;

    if (pattern.test(UA)) {
      return true;
    } else {
      return false;
    }
  }

  $(function() {
    //モバイルの場合mobileFileを、PCの場合はpcFileを読み込む
    var loadFile = (is_mobile()) ? mobileFile : pcFile;

    if ($("#the-content").find(insertSelector).length) {
      $.get(loadFile)
        .then(function(data) {
          $("#the-content").find(insertSelector).html(data);
        });
    }
  });
})(jQuery);