best method? CSS and a series of buttons.....

Start with a basic unordered list:

HTML:

<ul class="side_nav">
	<li class="current"><a href="#">List element 1</a></li>
	<li><a href="#">List element 2</a></li>
	<li><a href="#">List element 3</a></li>
</ul>

Then just style the links like this:

Code:

ul.side_nav
{
	margin: 0 0 20px 0; /* bottom margin */
	list-style: none; /* remove default bullets */
}

/* take off the default margin/padding */

ul.side_nav li
{
	margin: 0;
	padding: 0;
}

ul.side_nav li a
{
	padding: 0 0 0 10px; /* add 10px to the right side of the a link so theres room for the arrow to fit */
}

/* apply background arrow to hovered list and current class */

ul.side_nav li a:hover, ul.side_nav li.current a
{
	background: url("arrow.gif") no-repeat 0 3px;
}

Also see:
http://www.w3schools.com/css/default.asp
http://www.456bereastreet.com/archive/200502/efficient_css_with_shorthand_properties/