Highlight Navigation on Hover

navigation.html

<div id="nav" class="">
	<ul>
		<li class="nav" id="1"><a href="#" title="Home">Home</a></li>
		<li class="nav" id="2"><a href="#" title="About Us">About Us</a></li>
		<li class="nav" id="3"><a href="#" title="Contact Us">Contact Us</a></li>
		<li class="nav" id="4"><a href="#" title="Manage Suscriptions">Manage Suscriptions</a></li>
		<li class="nav" id="5"><a href="#" title="Job Seekers">Job Seekers</a></li>
		<li class="nav" id="6"><a href="#" title="Advertise">Advertise</a></li>
		<li class="nav" id="7"><a href="#" title="Work Programs">Work Programs</a></li>
	</ul>
</div><!-- /nav -->

script.js

$(document).ready(function() {
	$page = "Home";
	$("li#1").css('background-color', '#2b469c');
	$("li.nav").hover(
		function () {
			$title = $(this).children("a").attr("title");
			if ($title != $page) {
				$(this).css('background-color', '#2b469c');
			}
		},
		function () {
			if ($title != $page) {
				$(this).css('background-color', '#04273d');
			}
		}
	);
});