Bootstrap - Ao clicar personalizar estilo da aba (active)

Olá, estou utilizando o projeto de estilo do getbootstrap e estou com uma dificuldade.

Tenho uma lista de navegação por abas porém quero que quando o usuario clique, além de levá-lo à outra página a aba fique "ativa"...

Quando eu deixo o primeiro item por exemplo com a class "active" ele fica, porém nao muda...

Tentei fazer tal funcao com jQuery (sou iniciante...) pesquisei bastante, teve uma hora que consegui porem a pagina nao carregava somente funcionava a troca das abas....

Em umas de minhas pesquisas foi sugerido:

	<script>
	$(document).ready(function () {
 $('.nav li a').click(function(event) {
 $('.nav li').removeClass('active');

 var $parent = $(this).parent();
 if (!$parent.hasClass('active')) {
 $parent.addClass('active');
 }
 event.preventDefaul();
 });
	});
	</script>

Porém não funcionou...

Minha navegação:

 <ul class="nav nav-tabs">
 <li role="presentation" class="active"><a href="index.php">Home</a></li>
 <li role="presentation"><a href="consulta.php">Consulta</a></li>
 <li role="presentation"><a href="contato.php">Contato</a></li>
 </ul>

Obrigado pela atenção