Problema al ejecutar AJAX dentro de otro AJAX

[marx-pola]

Hola a todos! El tema es el siguiente. Tengo una página principal con un menu lateral con links. Estos links, por medio de AJAX, al presionar en cada uno de ellos, llama a otras páginas y me las muestra en el centro sin resetear la página principal y las mismas contienen solapas con diferente información.

El problema está en esas páginas con las solapas que aparecen. Al seleccionar alguna solapa, me muestra su contenido pero la solapa no queda marcada como ACTIVA.

El ejemplo para que lo vean funcionando está aquí: SOLAPAS CON AJAX

Vamos por partes... en la página principal, utilizo este script para llamar a las páginas que contienen las solapas. En este caso selecciono el link CUBARTE y me muestra la página cubarte.php con el contenido y sus solapas:

Código:

<script>
<!--
//inicializamos la libreria
var myConn = new XHConn();

//si no existe da error
if (!myConn) alert("XMLHTTP no disponible. Intenta un mejor browser.");

//funcion que se llama luego del include
var include_terminado = function (oXML) { document.getElementById('contenido').innerHTML = oXML.responseText; };

//funcion que hace el include
function include_dinamico (url)
{
//AJAX, llamo a la pagina y le mando los parametros
p=url
myConn.connect(p, "GET", "variable="+url, include_terminado);
}

</script>

<a href="javascript:;" onClick="include_dinamico('cubarte.php');">CUBARTE</a>
<div id="contenido"></div>

Dentro aparece otra página con solapas y el código de la misma es el siguiente:

Código css que ejecuta la función ajax:

Código HTML:

<style type="text/css" media="screen">
/* DIVS DE LAS SOLAPAS */

/* div exterior contenedor del menu */
.indentmenu{
font: bold 13px Arial;
width: 626px; /*leave this value as is in most cases*/
overflow: hidden;
}

/* divs de los menues de las solapas */
.indentmenu ul{
margin: 0;
padding: 0;
float: left;
width: 630px; /*width of menu*/
border: 1px; /*dark purple border*/
border-width: 1px 0;
background: #C38A87;
}

.indentmenu ul li{
display: inline;
}

.indentmenu ul li a{
float: left;
color: white; /*text color*/
padding: 5px 11px;
text-decoration: none;
border-right: 1px solid #ffffff; /*dark purple divider between menu items*/
}

.indentmenu ul li a:visited{
color: white;
}

.indentmenu ul li a:hover, .indentmenu ul li .current{
color: white !important; /*text color of selected and active item*/
padding-top: 6px; /*shift text down 1px for selected and active item*/
padding-bottom: 4px; /*shift text down 1px for selected and active item*/
background: #9C2F29;
}

/* div del contenido de las solapas */

#divcontenidos {
	display: inline;
    margin:0px;
	float: left;
	padding:23px;
    padding-top:0px;   
	width:580px;
}

</style> 

Código AJAX que ejecuta el cambio de las solapas y que debería activar y desactivar la solapa seleccionada:

Código:

<script type="text/javascript">

var cajasmicroinf = new Array(
				'quienes somos',
				'mision',
				'vision',
				'pensamiento',
				'reglamento',
				'encuesta');
		var microinf = new Solapas(cajasmicroinf,'Inf');


function Solapas(cuales,activo){
	var cajas = cuales;
	var estilo = activo;
	var div = null;
	this.solapas = solapas;

function solapas(cual){
		//div = 'aj' + cual;
		for (i=0;i<cajas.length;i++){
			var divcual = document.getElementById('li' + cajas[i]);
			var divmayor = document.getElementById(cajas[i]);
			if(cajas[i] == cual){
				divmayor.style.display = 'block';
			} else{
				divmayor.style.display = 'none';
			}
		}
	}

}

function aggEvento(){
	var links = document.getElementById('indentmenu').getElementsByTagName('a');
		for(i=0; links[i]; i++){
			links[i].onclick = function(){
				var links = document.getElementById('indentmenu').getElementsByTagName('a');
				for(j=0; links[j]; j++){
					links[j].className = '';
				}
				this.className = 'current';
			}
		}
	}
</script>

Y las solapas son estas y las llamo de esta manera:

Código HTML:

 <div class="indentmenu" id="indentmenu">
      <ul>
        <li><a id="liquienes" href="javascript:microinf.solapas('quienes somos');" class="current">quienes somos</a></li>
        <li><a id="limision" href="javascript:microinf.solapas('mision');" class="">misión</a></li>
        <li><a id="livision" href="javascript:microinf.solapas('vision');" class="">visión</a></li>
.........
      </ul>
    </div> 

Probé de pasar todo el script abajo de todo antes del </body> y tampoco funcionó (sugerencia de un colega).

Como les decía antes, lo único que me faltaría es que la solapa que selecciono quede ACTIVA.

Espero puedan ayudarme y desde ya muchas gracias.

Saludos. MArx.