jQueryでURLに特定の文字（#contentなどの文字）を足す

リンク要素<a href="◯◯◯.html">のURL「◯◯◯.html」の後ろに#contentを追加したいとします。
この場合は、要素に属性を設定するjQueryのattrを使用します。

HTML

<ul class="page-link">
<li><a href="page-link01.html">リンク01</a></li>
<li><a href="page-link02.html">リンク02</a></li>
<li><a href="page-link03.html">リンク03</a></li>
</ul>

jQuery

jQuery(function(){
	jQuery(".page-link a").each(function() {
		var obj = jQuery(this);
		var link = obj.attr("href");
		obj.attr("href",link+"#content")
	});
});

1. 対象を絞込む(.page-link要素内のa)
2. eachに関数を渡す
3. 関数内でjQuery(this)で対象オブジェクトを取得し、変数objに代入
4. 変数objに代入した対象オブジェクトのリンクURLを取得し、変数linkに代入
5. attrでリンクURLを「変数linkで取得したリンクURLに#contentをプラスした文字列」に置き換える

実行結果

<ul class="page-link">
<li><a href="page-link01.html#content">リンク01</a></li>
<li><a href="page-link02.html#content">リンク02</a></li>
<li><a href="page-link03.html#content">リンク03</a></li>
</ul>

失敗例

ちなみにうまくいかなかった書き方はこちら。
.page-link要素内のaが全て同じリンクURLになってしまいました。
eachしてないからですね。ご注意ください。

jQuery(function(){
	var link = jQuery(".page-link a").attr("href");
	link = link + "#content";
	jQuery(".page-link a").attr("href",link);
});