Time is ...

Ici !

<script>
function myS() {

var s = new Date().getSeconds();
var m = new Date().getMinutes();
var h = new Date().getHours();
var angleS = s*6;
var angleS2 = 360 + angleS;
var angleM = m*6;
var angleH = h*6;

document.getElementById("zone").innerHTML = (s);

var svgns = "http://www.w3.org/2000/svg";

var circle1 = document.createElementNS(svgSeconds.namespaceURI, 'circle');
    circle1.setAttribute('cx', '200');
    circle1.setAttribute('cy', '50');
    circle1.setAttribute('r', '10');
    circle1.setAttribute('transform', 'rotate('+angleS+' 200 200)');
    circle1.setAttribute('fill', '#555555');

var circle2 = document.createElementNS(svgSeconds.namespaceURI, 'circle');
    circle2.setAttribute('cx', '200');
    circle2.setAttribute('cy', '100');
    circle2.setAttribute('r', '15');
    circle2.setAttribute('transform', 'rotate('+angleM+' 200 200)');
    circle2.setAttribute('fill', '#555555');

var circle3 = document.createElementNS(svgSeconds.namespaceURI, 'circle');
    circle3.setAttribute('cx', '200');
    circle3.setAttribute('cy', '150');
    circle3.setAttribute('r', '20');
    circle3.setAttribute('transform', 'rotate('+angleH+' 200 200)');
    circle3.setAttribute('fill', '#555555');

var circle4 = document.createElementNS(svgSeconds.namespaceURI, 'circle');
    circle4.setAttribute('cx', '200');
    circle4.setAttribute('cy', '50');
    circle4.setAttribute('r', '10');
    circle4.setAttribute('opacity', '0.5');
    circle4.setAttribute('fill', '#555555');

var animation1 = document.createElementNS(svgns, 'animateTransform');
    animation1.setAttribute('attributeName', 'transform');
    animation1.setAttribute('attributeType', 'xml');
    animation1.setAttribute('type', 'rotate');
    animation1.setAttribute('values', ''+angleS+' 200 200; '+angleS2+' 200 200');
    animation1.setAttribute('dur', '60s');
    animation1.setAttribute('repeatCount', 'indefinite');

svgSeconds.appendChild(circle1);
svgSeconds.appendChild(circle2);
svgSeconds.appendChild(circle3);
svgSeconds.appendChild(circle4);
circle4.appendChild(animation1);

}
</script>
<button onclick="myS()">Go !</button>
<p id="zone">Ici !</p>
<svg id="svgSeconds" width="400" height="400">
<rect fill="#dedede" width="400" height="400" x="0" y="0"/>
<circle stroke="#555555" stroke-width="6" cx="200" cy="200" r="150" fill="none"/>
<circle stroke="#555555" stroke-width="6" cx="200" cy="200" r="100" fill="none"/>
<circle stroke="#555555" stroke-width="6" cx="200" cy="200" r="50" fill="none"/>

</svg>