jQuery 画像の出し分け方法アドバイス下さい！

質問

jQjueryを使用して、含まれる文字列によって
タイトル画像の出し分けをしたいのですが
うまく表示されません。ご教授いいただけませんでしょうか。

<p id="tag">あ</p> を含む場合、<h1><img src="A.jpg">タイトル名</h1> を表示、
<p id="tag">い</p> を含む場合、<h1><img src="B.jpg">タイトル名</h1> を表示、
<p id="tag">う</p> を含む場合、<h1><img src="C.jpg">タイトル名</h1> を表示

といった具合です。
h1に含むタイトル名はそのまま残し、h1内に画像を追加したいです。

-----------------------------------------
if (' #tag : contains ("あ") ') {
$('h1') .before('<p><img src="A.jpg"></p>');
}　else if (' #tag : contains ("い") ') {
$('h1') .before('<p><img src="B.jpg"></p>');
}　else if (' #tag : contains ("う") ') {
$('h1') .before('<p><img src="C.jpg"></p>');
}
-----------------------------------------

このようは表記ではダメでしょうか。

回答No.1

hanabutako

それをやるならこうでは？
if (jQuery('#tag:contains("あ")')) {
$('h1') .before('<p><img src="A.jpg"></p>');
} else if (jQuery('#tag:contains("い")')) {
$('h1') .before('<p><img src="B.jpg"></p>');
} else if (jQuery('#tag:contains("う")')) {
$('h1') .before('<p><img src="C.jpg"></p>');
}

jQueryで'#tag:contains("あ")'を評価する。
余計なスペースを入れない。:とcontainsの間やcontainsと(の間にスペースを入れたら文法エラーになって動きません。