如何使“切换器面板”的链接反映“显示”类？

Question

I am using jQuery Content Panel Switcher https://code.google.com/p/jquery-content-panel-switcher/

By adding the class 'show', you can determine which content/panel shows on load, but how do I make that reflect in the links that choose the content/panel.

Basically, if panel 1 is show, link 1 should be red.

I am already using this to change the link after the click

     $(document).ready(function(){
    $('.nav_buttons a').click(function(event){
        $('.nav_buttons a').css({ 'background-color' : '' }); //clear past selections
        $(this).css({ 'background-color' : 'red' }); //set new selection
    });    
  });

Answer 1

On first time page load just the default link that loads can be explicitly bind with a certain (css)class attribute and then on each click event the class attribute of the links can be changed accordingly using jQuery.

First remove all the class attributes of the links

$('.nav_buttons a').removeClass('selected');

Then add the specific css class that makes the navigation background color change

$(this).addClass('selected');

Here's a full demonstration on JsFiddle