画面ロード時に画像を表示させたい

Question

前提・実現したいこと

画面読み込み時にデフォルトの画像を表示させたいです。

発生している問題

ファイルパス(URL)が問題なのか、根本的に書き方がおかしいのかもしれないか、枠は表示されるのですが、画像が表示されないです。

分かる方いましたら、ご助力お願いします。

該当のソースコード

<label>アイコン</label>
<label class="div_icon">
	参照
	<input type="file" class="new_user_icon" id="new_user_icon"  accept="image/*">
</label>
<img id="new_user_icon_preview" width="150" height="150">

$(document).ready(function() {

パターン➀------------------------------------------------------------------
	$('#new_user_icon_preview').attr= ('src' , icon_path);
---------------------------------------------------------------------------

パターン➁------------------------------------------------------------------
	reader.onload = function (e) {
		$('#new_user_icon_preview').attr('src',e. icon_path.result);
	}
	reader.readAsDataURL(e.icon_path.files[0]);
---------------------------------------------------------------------------
})

試したこと

上記のようなパターンを試しましたがどれも枠のみで画像が表示されません。

完成予想図

参照ボタンで変更した際に画像を表示させることが出来ているので、完成予想図お添付いたします。

Comments

[yambejp]

new_user_icon_previewというidは見当たりませんが・・・

[FATE-T]

失礼しました。
HTML記載漏れがありました、追記しましたのでよろしくお願いします。

[yambejp]

icon_pathとはなんでしょう？

[FATE-T]

たびたび記載漏れがあって申し訳ございません。
icon_pathは画像の保存場所です。
以下のようになります。
https://localhost/xxxxxxxxx/cocoon-master-child/views/image/user_icon_base.png
xxxはサイト名称になりますので申し訳ございませんが伏せさせていただきます。