problema con datos en div que ha sido borrado previamente

[oms02]

Hola a todos. Veréis, tengo un problema que me esta trayendo por la calle de la amargura. A ver si me podéis echar un cable. Os comento:

En esencia se trata de un php en el que se ejecuta una función javascript. El javascript se trata simplemente de un reloj (digital) que se muestra en una serie de divs.

Ahora, (con el javascript ejecutándose), tengo un botón (html) en el que, al pulsar, la función (el reloj js) vuelve a ejecutarse de nuevo; es decir, el reloj empieza de nuevo. El proceso que realizo concretamente es esconder el div contenedor donde esta el reloj, ejecutar la función y mostrar de nuevo los divs.

Bueno, el maldito problema es que todo funciona casi perfecto, a excepción de que al darle al botón, en esa serie de divs se muestran los dos relojes.

Me imagino donde está la raíz del problema y es que al volver a llamarse al mismo código, los divs donde deben mostrarse los dígitos del reloj son los mismos donde antes se mostraba el antiguo reloj (los muestro por la clase y diferencio los digitos por el id).

He tratado de quitar los divs con: remove(), empty(), hide(), y alguno mas…pero el resultado siempre es el mismo: se acaban mostrando (en los mismos divs) los 2 relojes a la vez.


Aqui los codigos con el proceso completo:
El php que se ejecuta al principio:

Código HTML:

<div id="resultado">
<?php require ('reloj.php'); ?>//llamo al archivo donde se ejecuta el reloj
</div>
 

reloj.php

Código HTML:

<!-- aqui hay codigo php previo pero no influye para nada en el problema. -->
 
<div class="cuadro-reloj">
    <script type="text/javascript">tiempo()</script>//funcion js del reloj
    <div class="digito" id="dechora"></div>
    <div class="digito" id="unihora"></div>
    <div class="digito" id="dospuntos1"></div>
    <div class="digito" id="decmin"></div>
    <div class="digito" id="unimin"></div>
    <div class="digito" id="dospuntos2"></div>
    <div class="digito" id="decseg"></div>
    <div class="digito" id="uniseg"></div>
</div>
 

Ahora, mediante js (jquery), el evento que llama a ejecutar de nuevo la funcion si se hace click en el boton.

Código Javascript:

$("#boton-activar-reloj").live("click",function(){
    $.ajax({
        contentType: "application/x-www-form-urlencoded",
        type: "POST",
        url:'activarreloj.php',
        data: "",
        success: function(datos){
            $('.cuadro-reloj').remove();//aqui he probado de todo...
            $('#resultado').html(datos);
        }
    });
});
 

El archivo activarreloj.php contiene también un require al archivo reloj.php

Código HTML:

...
<?php require ('reloj.php'); ?>//llamo al archivo donde se ejecuta el reloj
 

Supongo que para arreglar el problema sobran la mitad de los codigos que os he mostrado pero prefiero dejar claro el proceso.

A ver si me podeis echar una mano, porfa, que llevo varios dias con lo mismo y no hay manera. Muchas gracias por vuestro tiempo.

1 saludo!