jQueryから外部ファイル（.js）を動的にインポートする。

Question

いつもお世話になっております。

jQueryを使いクリックしたタイミングでjsのファイルを読み込みたいと思っています。
調べてみますとAjax？という言葉を頻繁に目にしたのですが、内容を掴めずに苦戦しておりました。

$(document).ready(function() {
	$("#change_color li").click(function(e){
    //このタイミングで読み込ませたいと考えています。
    });
});

サイトの表示切り替え機能を実装しており通常のjsファイルに記述しているコードはすべて作動しているのですが、表示を切り替えるとどうしても上手く作動しない箇所があるため、外部ファイル化することで特定のコードを読み込ませるタイミングをズラそうと考えています。

上記のような場合、どのように指定すれば外部ファイルを読み込ませることができるでしょうか。
どなたかお答えいただけると嬉しいです。

・jQueryのAjaxでJavaScriptファイルを取得するときの罠
・How can I import JQuery into my js file?

//追記

コメントでご指摘いたき無事に問題が解決しました。
コピペになりますが、自己解決としてこちらに解決案を記載します。

var script = document.createElement("script");
script.src = "delay.js"; // 読み込みたい外部JSのURL
document.body.appendChild(script);

頭を捻らせてくれたすべての方々へ、どうもありがとうございました。

Comments

[m.ts10806]

内容次第なのでこれだけではなんとも言えません。表示切り替えだけならCSSなのでわざわざjsファイルを読み込み直すのは非効率です。

[退会済みユーザー]

ご指摘ありがとうございます。問題は解決されましたが、たしかに非効率であるためこのような指定方法をせずとも動作するような指定方法を見つけられるよう精進したいと思います。

[m.ts10806]

ひとまず解決されたようで何よりです

Answer 1

過去質ですがこちらは参考になりませんか？

Comments

[退会済みユーザー]

期待する動作になりました！！！
これまではサイトをリロードすればなんとか動くものの、表示を切り替えた直後ではうまく作動しないかったため大変困っておりました。
的確な記事をご提示いただきましてありがとうございます。