Problema com função no menu

Olá pessoal,

Estou com uma dúvida que não estou conseguindo resolver :wacko:

Primeiramente eu adaptei um menu em abas, ou seja, um menu que não carregasse uma nova página e sim trocasse o conteúdo de uma div, ai eu precisava fazer um menu lateral vertical fixo na esquerda, que fizesse a mesma coisa.

Tentei adaptar o código, o menu apareceu, até funciona, mas nao 100%.. do jeito que eu quero ele ta fazendo sumir o primeiro menu que eu fiz de errado?.. podem me ajudar?

CSS:

#container{

 width:900px;
 height:500px;
}

div.conteudo {

	padding:10px 15px;
	}
#cssmenu {
 margin-top: 10px;
}
#menu {
 height:500px;
 float:left;
 background: #333;
 list-style: none;
 margin: 0px 10px 0px 0px;
 padding: 0;
 width: 12em;
}

#menu li {

 font: 89.5% "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif;
 margin: 0;
 padding: 0;
 list-style: none;
}

#menu a {

 background: #333;
 border-bottom: 1px solid #393939;
 color: #ccc;
 display: block;
 margin: 0;
 padding: 8px 12px;
 text-decoration: none;
 font-weight: normal;
}

#menu a:hover {

 background: #2580a2 left center no-repeat;
 color: #fff;
 padding-bottom: 8px;
}

#menu li a.corrente {

	background:#2580a2;

	}

div.aba {

	background:#fff;
	text-align:justify;
	margin-bottom:20px;
	padding:10px 15px;
	border:1px solid #666;
	}
#nav {
	margin:0;
	padding:3px 0;
	border-bottom:1px solid #778;
	font:bold 12px Georgia, "Times New Roman", Times, serif;
	}

#nav li {

	list-style:none;
	margin-right:6px;
	display:inline;
	}

#nav li a {

	padding:3px 6px;
	border:1px solid #778;
	border-bottom:none;
	background:#dde;
	color:#333;
	text-decoration:none;
	}

#nav li a:hover {

	color:#000;
	background:#aae;
	border-color:#227;
	}

#nav li a.corrente {

	background:#fff;
	border-bottom:1px solid #fff;
	}

JavaScript do menu lateral:

$(document).ready(function(){
	$('#cssmenu').prepend(
	'<ul id="menu"><li class="corrente"><a href="#relatorios"><span>Relatórios</span></a></li><li><a href="#documentos"><span>Documentos</span></a></li><li><a href="#suporte"><span>Suporte</span></a></li><li class="last"><a href="#desconectar"><span>Desconectar</span></a></li>	</ul>')

	$('.conteudo').css({
 display: 'none',
 marginTop: 0,
 borderTopWidth: 0
 })

	$('#container_abas1').css('display', 'block');

	$('a', $('#menu')).click(function() {
 var i = $('a', $('#menu')).index(this) + 1;
 $(this).parents('#cssmenu').children('.conteudo:visible').hide();
 $('#container_abas' + i).show();
 $(this).parents('#menu').find('a').removeClass('corrente');
 $(this).addClass('corrente');
	})
})

JavaScript do menu em aba da div de dentro:

$(document).ready(function(){
	$('#container_abas').prepend(
	'<ul id="nav">	<li><a href="#aba1" class="corrente">2015</a></li> <li><a href="#aba2">2014</a></li> <li><a href="#aba3">2013</a></li> <li><a href="#aba4">2012</a></li> <li><a href="#aba5">2011</a></li> </ul>')

	$('.aba').css({
 display: 'none',
 marginTop: 0,
 borderTopWidth: 0
 })

	$('#aba1').css('display', 'block');

	$('a', $('#nav')).click(function() {
 var i = $('a', $('#nav')).index(this) + 1;
 $(this).parents('#container_abas').children('.aba:visible').hide();
 $('#aba' + i).show();
 $(this).parents('#nav').find('a').removeClass('corrente');
 $(this).addClass('corrente');
	})
})

e o HTML:

<div id="container">
	<div id="cssmenu">

	<div id="container_abas1" class="conteudo">

 <div id="aba1" class="aba">
 <h2>2015</h2>
 <p>Janeiro</p>
 <p>Fevereiro</p>
 <p>Março</p>
 <p>Abril</p>
 <p>Maio</p>
 <p>Junho</p>
 <p>Julho</p>
 <p>Agosto</p>
 <p>Setembro</p>
 <p>Outubro</p>
 <p>Novembro</p>
 <p>Dezembro</p>
 </div>

 <div id="aba2" class="aba">
 <h2>2014</h2>
 <p>Janeiro</p>
 <p>Fevereiro</p>
 <p>Março</p>
 <p>Abril</p>
 <p>Maio</p>
 <p>Junho</p>
 <p>Julho</p>
 <p>Agosto</p>
 <p>Setembro</p>
 <p>Outubro</p>
 <p>Novembro</p>
 <p>Dezembro</p>
 </div>

 <div id="aba3" class="aba">
 <h2>2013</h2>
 <p>Janeiro</p>
 <p>Fevereiro</p>
 <p>Março</p>
 <p>Abril</p>
 <p>Maio</p>
 <p>Junho</p>
 <p>Julho</p>
 <p>Agosto</p>
 <p>Setembro</p>
 <p>Outubro</p>
 <p>Novembro</p>
 <p>Dezembro</p>
 </div>

 <div id="aba4" class="aba">
	<h2>2012</h2>
 <p>Janeiro</p>
 <p>Fevereiro</p>
 <p>Março</p>
 <p>Abril</p>
 <p>Maio</p>
 <p>Junho</p>
 <p>Julho</p>
 <p>Agosto</p>
 <p>Setembro</p>
 <p>Outubro</p>
 <p>Novembro</p>
 <p>Dezembro</p>
 </div>

 <div id="aba5" class="aba">
 <h2>2011</h2>
 <p>Janeiro</p>
 <p>Fevereiro</p>
 <p>Março</p>
 <p>Abril</p>
 <p>Maio</p>
 <p>Junho</p>
 <p>Julho</p>
 <p>Agosto</p>
 <p>Setembro</p>
 <p>Outubro</p>
 <p>Novembro</p>
 <p>Dezembro</p>
 </div>

</div> <!-- Fim div#container_abas -->
<div id="container_abas2" class="conteudo">

 <div>
 teste2
 </div>
</div>
<div id="container_abas3" class="conteudo">

 <div>
 teste3
 </div>
</div>
<div id="container_abas4" class="conteudo">

 <div>
 teste4
 </div>
</div>
</div>
</div><!-- Fim div#container -->

Help?