jqueryでselect要素に項目を追加

jqueryでselect要素に項目を追加する方法をご紹介します。

以下のように指定します。

html

&lt;select class="hogehoge" name="clientName"&gt;
    &lt;option&gt;選択して下さい&lt;/option&gt;
    &lt;option&gt;太郎&lt;/option&gt;
    &lt;option&gt;次郎&lt;/option&gt;
    &lt;option&gt;花子&lt;/option&gt;
&lt;/select&gt;

<option>選択して下さい</option>

</select>

js側

$('[name=clientName]').append($("&lt;option&gt;").val("カモ").text("カモ"));

1	$('[name=clientName]').append($("<option>").val("カモ").text("カモ"));

nameが「clientName」の場合に、<option>タグが「花子」の下に追加されます。

ただし、ソースをみても表示はされません。webページとして開いた際に「カモ」が表示されるようになります。