Navigation Pannel

Navigation Pannel


I have defined a Menu like the following that works for HTML code.

This is the definitions of the Stlyle:

  1. <style>
    #nav ul {padding: 0; margin:;0; list-style-type:none;}
    #nav li {display: inline;}
    #nav li a {font-family: Arial;font-size:15px;text-decoration: none;float:left;padding: 12px;background-color: #fff;color: #3EA99F; border-bottom:0px solid #000;}
    #nav li a:hover {background-color: #3EA99F; color: #fff; padding-bottom:12px; border-bottom:0px solid #000; margin:-1px;}
    </style>






This is the code for adding the menu:

  1. <ul id="nav" style="clear:both;">
    <li><a href="/mainpage.html"><b>Home</b></a></li>
    <li><a href="/places.html"><b>Places</b></a></li>
    <li><a href="/about.html"><b>About Us</b></a></li>
    </ul>





Since this is going to be copied in every single HTML page and now it is so simple, I may want to add additional items to the menu and to do so I would need to copy and paste the code in every single HTML page on my site.

I would like to know if there is any possible way to write a code in jQuery for this menu, so I could just add items in my jQuery file.

Please, Could anyone help me out with that code? I don't know jQuery.

Thank you so much