Jquery 親要素で順番入れ替え

質問

Jquery 親要素で順番入れ替え

a要素を取得して、その親の親(<div id="shop">)の順番を入れ替えしたいのです。
【HTML】
<div id="shop">
<p><a href="http://www.aaaa.jp">お店の名前</a></p>
<p>あああああああああ</p>
</div>

<div id="shop">
<p><a href="http://www.bbbb.jp">お店の名前</a></p>
<p>あああああああああ</p>
</div>

<div id="shop">
<p><a href="http://www.cccc.jp">お店の名前</a></p>
<p>あああああああああ</p>
</div>

【Jquery】
$(function(){
$('a[href*="http://www.aaaa.jp"]').parent().parent();
$('a[href*="http://www.bbbb.jp"]').parent().parent();
....
});

これで『http://www.aaaa.jp』のリンクを持つdivと『http://www.bbbb.jp』のリンクを持つdivとを指定できるわけですが、
ページを表示した時に順番を入れ替えするにはどうしたらよいのでしょうか？例えば、

【実行結果HTML】
<div id="shop">
<p><a href="http://www.cccc.jp">お店の名前</a></p>
<p>あああああああああ</p>
</div>

<div id="shop">
<p><a href="http://www.aaaa.jp">お店の名前</a></p>
<p>あああああああああ</p>
</div>

<div id="shop">
<p><a href="http://www.bbbb.jp">お店の名前</a></p>
<p>あああああああああ</p>
</div>

HTMLを直接触って変更できたら楽なんですけどね～。PHPで吐き出されているのでムリなんです。ソースぐちゃぐちゃで仕様書もない始末なので、Jqueryで入れ替えできないものかと・・・

回答No.1

steel_gray · ベストアンサー

以下でどうかな？

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(function(){
var shopA = $('a[href*="http://www.aaaa.jp"]').parent().parent();
var shopC = $('a[href*="http://www.cccc.jp"]').parent().parent();
shopA.before(shopC);
});
</script>

http://semooh.jp/jquery/api/manipulation/before/content/

お礼

すんばらし～～！！！OKです
ありがとうございます。
なるほど、そのまま変数に入れて、before　とか　afterとか　appendとか使えば、
自由に入れ替えできそうですね。ありがとうございました！！