jQueryオブジェクトに対する変更

質問

jQueryオブジェクトに対する変更は可能？

ちょっと特殊！？なのかもしれませんが、下記の内容が実現できるかどうかを検証しております。
悩んでいるポイントは「←　ココ」の部分です。
良いアイデアをお持ちの方、是非御教示願い申し上げます。

＜サンプルHTML＞
<p id="hogehoge">
<ul>
<li>aaaaaa</li>
<li>bbbbbb</li>
</ul>
<div id="foo"><strong>cccccc</strong></div>
</p>

＜実現したい事＞＝＝＝＝＝＝＝＝＝＝＝＝

var html_obj = $("p#hogehoge").clone(); // 特定のpタグを含むhtmlコードをオブジェクト化

// html_objに含まれる<ul>タグの内容を変更　　←　ココ
// html_objに含まれる<div>タグの内容を変更　　←　ココ

return html_obj // 関数の戻り値としてhtml_objを戻す。
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

＜欲しい結果＞
<p id="hogehoge">
<ul>
<li>zzzzzz</li>
<li>xxxxxx</li>
</ul>
<div id="foo"><strong>yyyyyy</strong></div>
</p>

回答No.1

fujillin · ベストアンサー

＞悩んでいるポイントは「←　ココ」の部分です。
何をどう悩んでいるのかが不明なので、以下の回答は的外れかもしれませんが、違っていたらスルーしてください。

確認はしていませんが…

御提示のＨＴＭＬはパース時に
<p id="hogehoge"></p>
<ul>
<li>aaaaaa</li>
<li>bbbbbb</li>
</ul>
<div id="foo"><strong>cccccc</strong></div>
<p></p>
として解釈されると思いますので、そのままでは（多分）ご希望の結果は得られないかと思います。

それは置いておくとして、
HTMLの構成が事前にわかっているのであれば、それに沿って子孫要素を特定すればよいだけなので、通常の処理でできるはずかと思います。
例えば、html_objに全体を包括する要素（のクローン）が取得できているとすれば
　　$("li", html_obj)　とか
　　html_obj.find("li")
とすることで、子孫のli要素が取得できますので、普通に内容を入替えればよろしいかと。

ただし、idを持つ要素のクローンを作成する場合、idが一意でなくなる可能性がありますのでご注意を。

お礼

回答ありがとうございます。
確かに・・・・記述したサンプルのタグは間違っていますね。
御指摘ありがとうございます。

基本的な考え方が間違っていた様子です。
教えていただきました「html_obj.find("li")」を下記のようにすることで目的の動作を実現できました。

関数の引数(HTMLタグ文字列)として、下記のvar行にある変数htmlを渡していたのですが、そのHTMLを加工して関数の戻り値にできないかと試行錯誤していた次第です。

var html_obj = $("#hogehoge",html).clone();
html_obj.find("ul").append("<li>あいうえお</li>");
html_obj.find("#id strong").text("あいうえお");

return html_obj;

大変助かりました。
ありがとうございました。