http://jquery.com/
<script type="text/javascript" src="js/jquery.js"></script> とか <script type="text/javascript" src="jquery.js" charset="shift_jis"></script> グーグルのWebサービス「Google AJAX Libraries API」を利用する場合 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript">
function changeText(){
$("#about").html("ほげほげ");
}
</script>
document.getElementById('id属性値');
document.getElementsByTagName('要素【タグ】名');
getElementsByTagNameメソッドで指定する要素名を持った要素は，HTML上に一つだけとは限りません。
そのため，getElementsByTagNameメソッドは，getElementByIdメソッドとは違い，リストが返ってきます
しかし，得られたリストは，JavaScriptの配列とは異なります。
この得られたリストは，NodeListと呼ばれます。NodeListには次のメソッドとプロパティが規定されています
itemメソッド：引数にインデックス番号を指定することで，該当の要素を返します。インデックス番号は0から数えます。
lengthプロパティ：NodeListに格納されている要素の数を返します。
document.getElementsByName('name属性値');
特定のname属性値がセットされた要素は，必ずしも一つとは限りません。
そのため，getElementsByNameメソッドは，getElementsByTagNameメソッドと同様に，該当の要素のリストをNodeListとして返します。
★getElementsByNameメソッドは，documentオブジェクトに対してしか適用できません。
参考ページ 第3回 DOMスクリプティングのことはじめ(1) ～要素（タグ）を狙い撃ち～
$(function(){
//初期DOM操作など
//DOMを使って文書を操作するためには対象の要素が読み込まれている必要があります。
});
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=shift_jis">
<title>jQuery Sample</title>
<link rel="stylesheet" href="hoge/hoge.css" type="text/css" media="all">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" charset="shift_jis"></script>
<script type="text/javascript">
function changeText(){
$("#sample1").html("<b>Hello jQuery</b>");
}
</script>
</head>
<body>
<h1>jQuery Sample</h1>
<p id="sample1">Hello jQuery</p>
<form>
<input type="button" value="書き替え" onClick="changeText()">
</form>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=shift_jis">
<title>jQuery Sample</title>
<link rel="stylesheet" href="hoge/hoge.css" type="text/css" media="all">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" charset="shift_jis"></script>
<script type="text/javascript">
function changeText(){
$("#sample1").html("<b>Hello jQuery</b>");
}
$("html").bind("click", function(event){
$("#sample1").text("event.pageX: " + event.pageX + " " + "event.pageY: " + event.pageY);
})
</script>
</head>
<body>
<h1>jQuery Sample</h1>
<p id="sample1">Hello jQuery</p>
<form>
<input type="button" value="書き替え" >
</form>
</body>
</html>
http://wiki.kyosuke.jp/jquery
