<style type="text/css">
.clock{
   cursor:pointer;
   padding:5px 5px 5px 5px;
   margin:5px 0 5px 0;
   width:70px;
   -webkit-border-bottom-right-radius: 4px;
   -webkit-border-bottom-left-radius: 4px;
   -webkit-border-top-right-radius: 4px;
   -webkit-border-top-left-radius: 4px;
   -moz-border-radius-bottomright: 4px;
   -moz-border-radius-bottomleft: 4px;
   -moz-border-radius-topright: 4px;
   -moz-border-radius-topleft: 4px;
   text-align:center;
   font-weight: bold;
   font-family: arial;
}


#clock {
   background-color:#000000;
   color:#00CC66;
}

#reloj {
   background-color:#999999;
   color:#FFFFFF;
}


#rellotje {
   background-color:#237ab2;
   color:#FFFFFF;
}
</style>

<script type="text/javascript">
function moveClock(idClock,startTime){//move given clock
   var timeout=1000;//miliseconds to repeat the function

   if ( startTime === undefined ) {//just take the browser time
          rightNow = new Date();
      hour = rightNow.getHours();
      minute = rightNow.getMinutes();
      second = rightNow.getSeconds();      
   }   
   else{//starttime set
      rightNow = startTime.split(':',3);
      hour = parseInt(rightNow[0],10);
      minute =  parseInt(rightNow[1],10);
      second =  parseInt(rightNow[2],10);
      if (second==59){
         if (minute==59){
            if (hour==23) hour=0;   
            else hour++;
            minute=0;
         }else minute++;
         second=0;
      }else second++;
   }

   if (minute<10) minute= "0" + minute;
   if (second<10) second= "0" + second;

   currentTime=hour + ":" + minute + ":" +second;// tim to return
   document.getElementById(idClock).innerHTML = currentTime;//tim for the HTML element

   //recursivity
   if (startTime===undefined) setTimeout("moveClock('"+idClock+"')",timeout);//browser time
   else setTimeout("moveClock('"+idClock+"','"+currentTime+"')",timeout);//set time
      
}
</script>

<div id="clock" class="clock">clock</div>moveClock("clock");


<script  type='text/javascript'>
moveClock("clock");
</script>