Active pelo javascript

[MTavares]

Salve colegas.

Estou com uma dúvida e conto com a força de vocês para solucioná-la. Tenho o seguinte código que a colega aqui no fórum postou algum tempo atrás:

function ExpandeDiv(id_cadastro)
{
var qtd_div = document.getElementsByTagName('div').length;
var div_sel = document.getElementById(id);
var todas_divs;

for (var i = 1; i <= qtd_div; i++)
{
todas_divs = document.getElementById("div"+i);

if (todas_divs.id != id_cadastro)
todas_divs.style.display = 'none';
else
div_sel.style.display = 'block';
}
}

<ul id="menu-esquerdo">
                <li class="div-menuI"><a href="java script:onclick=ExpandeDiv('div1')">Menu I</a></div>
                <li class="div-menuII"><a href="java script:onclick=ExpandeDiv('div2')">Menu II</a></div>
                <li class="div-menuII"><a href="java script:onclick=ExpandeDiv('div3')">Menu III</a></div>
</ul>

<div id="div1">Conteúdo I</div>
<div id="div2">Conteúdo II</div>
<div id="div3">Conteúdo III</div>

Gostaria que ao clicar em um item do menu, ele ficasse ativo. Tentei pelo CSS, mas não consegui. Vale lembrar que as imagens estão dentro do CSS:

#menu-esquerdo .div-menuI a{
    float:left;
    margin-top:40px;
    margin-left:15px;
    background-image:url(../images/imagem_inativo.png);
    width:250px;
    height:35px;
    }
#menu-esquerdo .div-menuI a:hover{
    float:left;
    margin-top:40px;
    margin-left:15px;
    background-image:url(../images/imagem_ativo.png);
    width:250px;
    height:35px;
    }

O mesmo acontece com os links MenuII e MenuIII.

Obrigado!

Editado Janeiro 25, 2013 por MTavares

[MTavares]

Olá colegas.

tentei colocar esse comando na condicional abaixo, mas não funcionou:

====================================

if (todas_divs.id != id_cadastro){

todas_divs.style.display = 'none';

}else{

document.getElementById(todas_divs.id).style.backgroundImage = "images/olocal_ativo.png";

div_sel.style.display = 'block';

}

=====================================

Editado Janeiro 25, 2013 por MTavares