<ulid=”menuBar”>

<liclass="firstchild"><ahref="javascript:#">Home</a>

<divclass="menuInfo">I am some text about the home section</div></li>

<li><ahref="javascript:#">Services</a>

<divclass="menuInfo">I am some text about the services section</div></li>

<li><ahref="javascript:#">Clients</a>

<divclass="menuInfo">I am some text about the clients section</div></li>

<li><ahref="javascript:#">Portfolio</a>

<divclass="menuInfo">I am some text about the portfolio section</div></li>

<li><ahref="javascript:#">About</a>

<divclass="menuInfo">I am some text about the about section</div></li>

<li><ahref="javascript:#">Blog</a>

<divclass="menuInfo">I am some text about the blog section</div></li>

<li><ahref="javascript:#">Follow</a>

<divclass="menuInfo">I am some text about the follow section</div></li>

<li><ahref="javascript:#">Contact</a>

<divclass="menuInfo">I am some text about the contact section</div></li>

</ul>

</div>

</div>

{

$('#menuBar li').click(function()

{

 var url = $(this).find('a').attr('href');

 document.location.href = url;

});

$('#menuBar li').hover(function()

{

   $(this).find('.menuInfo').slideDown();

},

function()

{

 $(this).find('.menuInfo').slideUp();

});

});