javascriptとCSSで背景色が入れ替わるナビゲーションを作る

Javascriptを＜header＞部分に記載

<script type="text/javascript">
　　<!--
function changeBackgroundColor( id, color){
　　document . getElementById(id) . style . backgroundColor = color;
}
　　 -->
</script>

HTML部分

<nav id="yokomenu" style="background-color:lightgray;">
<p id="cbc01" style="background-color:lightblue;color:black;height:20px;padding:10px;
margin:0px;" onMouseOver="changeBackgroundColor( 'cbc01', 'lightgreen')"
onmouseout="changeBackgroundColor( 'cbc01', 'lightblue')">
<a href="http://quichua.sakura.ne.jp/">Home</a>
</p>
<p id="cbc02" style="background-color:lightblue;color:black;height:20px;padding:10px;
margin:0px;" onMouseOver="changeBackgroundColor( 'cbc02', 'lightgreen')"
onmouseout="changeBackgroundColor( 'cbc02', 'lightblue')">
<a href="/">contact</a>
</p>
<p id="cbc03" style="background-color:lightblue;color:black;height:20px;padding:10px;
margin:0px;" onMouseOver="changeBackgroundColor( 'cbc03', 'lightgreen')"
onmouseout="changeBackgroundColor( 'cbc03', 'lightblue')">
<a href="http://d.hatena.ne.jp/masomi79/">blog</a>
</p>
</nav>