html要素を移動・置換・挿入させるjQueryコード

blog.minimal-green.com
はてなブログの公式パンくずリストを記事上、下に移動させるカスタマイズについての記事を書きましたが、
前回では空のdivを用意してその中のhtmlを既に記述されたhtml（サイドバーの関連モジュール）から取得し変更するという方法でした。
（という認識であってますか？）
JavaScript、jQueryはほとんどわからないのですが、コードを眺めているうちに少しだけ法則性がわかってきたので勉強がてらカスタマイズ用のコードを書いてみます。

JQueryを読み込んでいない場合は読み込んで下さい。

<!--jQueryを使用-->
<script src="https://code.jquery.com/jquery-1.9.1.min.js" type="text/javascript"></script>

参考：
qiita.com

HTMLの移動

操作*	使用例*	備考*
要素の後にHTMLを移動(同階層)	$('A').insertAfter('B');	Bの後に指定した要素Aを移動

応用：はてな公式のパンくずリストを記事下に移動する

<script type="text/javascript">
$(function(){
  $('.page-entry .breadcrumb').insertAfter('.entry-content');
});
</script>

デザイン的に気になる時は#top-boxのボーダーや.breadcrumbのmarginなどCSSで修正して下さい。

.page-entry #top-box {
border:none;
}
.page-entry .breadcrumb {
    margin-bottom: 0;
}

.insertAfter('.entry-content');を.insertAfter('.entry-footer');にすれば、ページ下部に移動されます。

要素の置き換え

操作*	使用例*	備考*
指定した要素を他の要素に置き換える	$('A').replaceWith('B');	A要素をB要素に置き換え
指定した要素を置き換える	$(‘A’).replaceAll(‘B’);	B要素をA要素に置き換え

応用：記事個別ページのカテゴリーをはてな公式パンくずリストに置換する

<script type="text/javascript">
$(function(){
  $('.page-entry .breadcrumb').replaceAll('.page-entry .categories');
});
</script>

特定のURLで指定した要素Aの前に要素Bを挿入する

<script>
$(function(){
    if(location.href=="URL"){
        $('挿入先要素A').before('挿入する要素B');
    } 
});
</script>

カテゴリーページのカスタマイズに使えそうですね。
【追記】
現在ははてなブログProなら、カテゴリーページはページのタイトルや説明文をカスタマイズができます。説明文はHTMLも使えます。
staff.hatenablog.com

いかがでしょうか。はてなブログでもいろいろカスタマイズに応用できそうです。
不勉強で間違ってるところがあったらすみません。
JavaScript、jQueryちゃんと勉強しよう！と思います。