jquery - How to Select Specific List Items in Dynamic Bootstrap navbar menu for WordPress -

i have created dynamic bootstrap navbar menu wordpress. see menu design, please visit link: https://dl.dropboxusercontent.com/u/211935016/images/created_menu.jpg

but there things still need done. top nag “special promotions” , “board certified” need have box around them stand out. see design, please visit link: https://dl.dropboxusercontent.com/u/211935016/images/original_menu.jpg

here html code:

<!-- menu's code twitter bootstrap --> <div class="navbar navbar-inverse container mainmenu" role="navigation"> <div class="navbar-header">     <button type="button" class="navbar-toggle" data-toggle="collapse"   data-target=".navbar-collapse">         <span class="sr-only">toggle naavigation</span>         <span class="icon-bar"></span>         <span class="icon-bar"></span>         <span class="icon-bar"></span>     </button>     <a class="navbar-brand" href="" >navigation</a> </div> <div class="navbar-collapse collapse">     <?php      $args = array(             'theme_location' => 'top-bar',             'depth'          => 2,             'container'      => false,             'menu_class'     => 'nav navbar-nav',             'walker'         => new bootstrap_walker_nav_menu()     );     wp_nav_menu($args);      ?>  </div>  </div>  <!-- menu's code twitter bootstrap --> 

here css code:

.mainmenu {background:#f2f0f1;border:none;margin-top:10px;margin-bottom:10px;} .navbar-inverse .navbar-brand {color: #101010;} .navbar-inverse .navbar-brand:hover {color: #101010;} .navbar-inverse .navbar-toggle {border-color: #333333;background:#333333;} .navbar-collapse {padding-right: 0px;padding-left: 0px;} .navbar-brand {display:none;} .mainmenu ul.navbar-nav {margin-left: -10px;} .mainmenu ul.navbar-nav li {margin-top: 12px;margin-left: 10px;} .mainmenu ul.navbar-nav li {color:#101010;padding: 5px 2px;font-family: 'open sans', sans-serif;font-size:18px;} .mainmenu ul.navbar-nav li a:hover {color:#fff;background:#13b4e3;} 

and use code: http: // pastebin dot com/s0ucduyi in functions.php file activate bootstrap navbar menu wordpress.

can me fix it? thank you.

the easiest way add new class 2 menu items on wordpress | appearance | menus page.

to make sure can view menu css classes:

• go the menu editing page
• click screen options @ top right of screen
• under 'show advanced menu properties' click 'css classes'

now in entries 2 pages in menu ( “special promotions” , “board certified” ) can add new class such 'highlight'.

then add in css new class:

.highlight { background: blue ... }