Ребята помогите сделать выделенный активный пункт меню. В js не силен, так просто просматривал что к чему. Есть меню состоящее на половину из статических пунктов и динамических (БД). Вот код:

<div id="gorNav">
	<ul>
	        <li class="on"><a href="<?=SITE_URL;?>">Главная</a></li>					
		<li><a href="<?=SITE_URL;?>archive">Новости</a></li>
		        <? if($pages_gor) :?>
			<? foreach($pages_gor as $item) :?>
				<li><a href="<?=SITE_URL;?>page_gor/id/<?=$item['page_id'];?>"><?=$item['title']?></a></li>
			<? endforeach;?>
			<? endif;?>	
		<li><a href="<?=SITE_URL;?>catalog">Материалы</a></li>					
	</ul>
</div>

В CSS прописал класс ON:

.on{
background:url(../images/naw1.png) no-repeat;
background-size:100% 100%;
color:#263e57;
}

Пробовал готовые коды с инета ничего не получается, 2 дня уже мучаюсь. Есть знатоки которые смогут это сделать и если можно, то по подробнее. Может я не там что-то прописал. Спасибо!