HTML 内に JavaScript 呼び出しを埋め込むことは、悪い習慣です。機能、スタイル、およびマークアップが分離されていると、コードの保守性が大幅に向上します。次に、要素をまたはタグ<li>
のペア内にネストする必要があります。<ul>
<ol>
このタスクに取り組む方法の jsFiddle の例を作成しました。
http://jsfiddle.net/dLqja/1/
このコードでは、「クリック」リスナーを作成しました。これは、ID を介してボタンにアタッチされます。ボタンを押すと、「li」要素の表示スタイルを動的に変更する匿名のコールバック関数がトリガーされます。
jQueryの組み込み
ページに含める最初の JavaScript を次のようにします。
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
この jQuery スクリプトは Google によってホストされており、次のような利点があります (これを使用して以前の Web サイトにアクセスすると、クライアントのブラウザーに既にキャッシュされている可能性があります)。
jQuery の機能を使用する JavaScript コードは、上記のスクリプトの後に含める必要があります。
なし jQuery バージョン...
ボタンにイベントリスナーを割り当てることで、上記と同様の結果を得ることができます。このアプローチは、マークアップから機能を分離する規則に固執するため、 onclick="..." を使用するよりも望ましい方法です。これらの回答のいずれもうまくいかない場合は、ブラウザのコンソールでエラー メッセージを確認してください。
http://jsfiddle.net/SvufY/1/