ワードプレスで質問です。

ローディングを実装しようと考えています
参考サイト　http://www.finefinefine.jp/web/kiji1706/

記述通り行ったのですができませんでした。
原因は
<!--start-->
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">google.load("jquery", "1.4");</script>
<script type="text/javascript">
$(function() {
$("#button").one('click', function() {
$("#loading").show();
$("#pics").load('test.html', function() {
$("#loading").fadeOut(function() {
$("#pics").show();
});
});
});
});
</script>
</head>
<!--end-->
＊＊＊上の２行がワードプレスでは<?php wp_enqueue_script('jquery'); ?>
で表示されるためそれが原因かと考えましたがいかがでしょうか？
①対応として wp_deregister_scriptを使い上を記述は他のプラグインに影響するのでNG
②干渉しないよう記述にある$をjqueryなどに変えるもダメ

つまってしまいまして何かヒントがあれば幸いです。