how to style a selected button/link with css or javascript?

Question

I would like to style my selected button. I would like to display a light-blue border around the image of my selected button to show which page the user is on. (or just use the same hover image as the selected button image when the button is pushed.) I didn't have success with the css link selectors :visited, :focus, or :selected. Does this require a javascript solution? thanks for any pointers!

Answer 1

i usually just a extra class name called selected

   <div class="button selected">Button 1</div> 
   <div class="button">Button 2</div>

  .selected {
      border: 1px solid #0000ff;
  }

It depends on how you display your page (using ajax or refresh on every click). If you are using javascript to load the page content than you just put an extra classname using javascript when the button is clicked.