html+cssの準備

たとえばこんなファイル構成だったとします。

リストでマークアップするとこんな感じになるんじゃないかな。

html

	<ul id="side-nav">
		<li><a href="01.html">メニュー1</a></li>
		<li><a href="02.html">メニュー2</a></li>
		<li>
			<a href="03.html">メニュー3</a>
			<ul id="sub01">
				<li><a href="sub01/01.html">サブメニュー1</a></li>
				<li><a href="sub01/02.html">サブメニュー2</a></li>
				<li><a href="sub01/03.html">サブメニュー3</a></li>
			</ul>
		</li>
		<li>
			<a href="04.html">メニュー4</a>
			<ul id="sub02">
				<li><a href="sub02/01.html">サブメニュー1</a></li>
				<li><a href="sub02/02.html">サブメニュー2</a></li>
				<li><a href="sub02/03.html">サブメニュー3</a></li>
			</ul>
		</li>
	</ul>
	

かなり効率悪いで、子メニューのあるulにはidにディレクトリ名を指定しなくてはいけません。

css

	ul ul {
		display: none;
	}
	ul ul.active {
		display: block;
	}
	

子メニューのulは「display: none」で消しときます。
あとでjavascriptでクラスに「active」を指定すれば表示できる寸法。

サブメニューを開いた状態にするjavascript

javascriptでは現在のページの親ディレクトリを取得して、正規表現であらかじめ指定しておいたディレクトリ名のidとマッチさせ置き換えます。

javascript

	$(function() {
		//現在のURLを配列で取得	  	
		var now = location.href.split('/');
		//親のディレクトリ取得
		var dir = now.slice(now.length-2,now.length-1);
		var reg = new RegExp('(id=¥"'+dir+'¥"|id='+dir+')');
		$('#side-nav').each(function(){
			var txt = $(this).html();
			$(this).html(
				txt.replace(reg,'$1 class=¥"active¥"')
			);
		});
	});
	

※¥の部分は打ち直さないと実行できないかもしれません。

【3～5行目】

コメントの通りですが、現在のURLを取得して最後から2番目の配列を取得することで、親ディレクトリの文字列を取得しています。

【6行目】

正規表現です。変数を正規表現に入れる場合はRegExpオブジェクトを使用する必要があるようです。
注意点としてはieの場合「""」が外れて「id=sub01」となるので2つ検索しています。

【7～12行目】

ここで置き換え処理をしています。
マッチしたidがあったら「class="active"」を追加しています。

サブメニューのあるサイドメニューはアコーディオンを使用する方法が基本だと思いますが、アコーディオンにすると親のボタンが使用できなくなるので、それではまずいといったケースだったら使用できるのではないかと思います。
でも、もっと良い方法があると思います……。

参考サイト

【jQuery】ナビゲーションでの現在位置