Use a function multiple times

Your main problem is the cont variable that is one, not one per clock. It was only me that I entered a variable myCont per clock and use it instead of cont that worked.

Here's jsfiddle: link

Here's the code:

var cont = 0;

function horloge_dynamique(x, y, diametre, decalage) {

    var myCont = cont;
    var svg = document.getElementById('svg');
    cont++;

    //cree circle
    var newCircle = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
    newCircle.setAttributeNS(null, 'id', 'circle' + myCont);
    newCircle.setAttributeNS(null,'stroke-width', 2);
    newCircle.setAttributeNS(null,'stroke', 'black');
    newCircle.setAttributeNS(null,'fill', 'Aqua');
    svg.appendChild(newCircle);

    //cree aiguille heure
    var newLine = document.createElementNS('http://www.w3.org/2000/svg', 'line');
    newLine.setAttributeNS(null, 'id', 'heure' + myCont);
    newLine.setAttributeNS(null, "stroke", "red");
    newLine.setAttributeNS(null, "stroke-width", "4");
    svg.appendChild(newLine);

    //cree aiguille minute
    var newLine = document.createElementNS('http://www.w3.org/2000/svg', 'line');
    newLine.setAttributeNS(null, 'id', 'min' + myCont);
    newLine.setAttributeNS(null, "stroke", "orange");
    newLine.setAttributeNS(null, "stroke-width", "2");
    svg.appendChild(newLine);

    //cree aiguille seconde
    var newLine = document.createElementNS('http://www.w3.org/2000/svg', 'line');
    newLine.setAttributeNS(null, 'id', 'sec' + myCont);
    newLine.setAttributeNS(null, "stroke", "black");
    newLine.setAttributeNS(null, "stroke-width", "1");
    svg.appendChild(newLine);

    //var circle = document.getElementById("circle_horloge");
    var circle = document.getElementById("circle" + myCont);
    circle.setAttribute("cx", x);
    circle.setAttribute("cy", y);
    circle.setAttribute("r", diametre);

    //heure
    //var aiguille_heure = document.getElementById("heure");
    var aiguille_heure = document.getElementById("heure" + myCont);
    aiguille_heure.setAttribute("x1", x);
    aiguille_heure.setAttribute("y1", y);
    aiguille_heure.setAttribute("x2", x);
    aiguille_heure.setAttribute("y2", (y - diametre) + diametre / 3);

    //minutes
    var aiguille_min = document.getElementById("min" + myCont);
    aiguille_min.setAttribute("x1", x);
    aiguille_min.setAttribute("y1", y);
    aiguille_min.setAttribute("x2", x);
    aiguille_min.setAttribute("y2", (y - diametre) + diametre / 5);

    //secondes
    var aiguille_sec = document.getElementById("sec" + myCont);
    aiguille_sec.setAttribute("x1", x);
    aiguille_sec.setAttribute("y1", y);
    aiguille_sec.setAttribute("x2", x);
    aiguille_sec.setAttribute("y2", y - diametre);


    setInterval(function(){ 
        var d = new Date(); //date

        var heure_decalage = d.getHours() + decalage;
        var minute = d.getMinutes();
        var seconds = d.getSeconds();

        var heure_calc = (30 * ((heure_decalage) % 12) + (d.getMinutes() / 2));
        var minute_calc = 6 * minute;
        var seconde_calc = 6 * seconds;

        var heure = document.getElementById("heure" + myCont);
        var min = document.getElementById("min" + myCont);
        var sec = document.getElementById("sec" + myCont);

        //title horloge
        document.getElementById("circle" + myCont).setAttribute("title", heure_decalage + ":" + minute);

        heure.setAttribute('transform', 'rotate(' + heure_calc + " " + x + " " + y + ')');

        min.setAttribute('transform', 'rotate(' + minute_calc + " " + x + " " + y + ')');
        sec.setAttribute('transform', 'rotate(' + seconde_calc + " " + x + " " + y + ')');
        //setTimeout("r(x, y, diametre, decalage, myCont)", 1000); 
    }, 1000);
}

var x = 500;
var y = 250;

var x1 = 200;
var y1 = 100;

var diametre = 100;

var decalage = 0; 

horloge_dynamique(200, 200, diametre, decalage);

horloge_dynamique(100, 100, diametre, decalage);

<svg id="svg" width="100%" height="800">
</svg>

link

HTML

<svg id="svg01" width="100%" height="800">    </svg>
<svg id="svg02" width="100%" height="800">    </svg>

JAVASCRIPT

    //var cont = 0;

function horloge_dynamique(id,cont,x,y,diametre,decalage){

    var svg = document.getElementById(id);
    //cont++;

    //cree circle
    var newCircle = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
    newCircle.setAttributeNS(null, 'id', 'circle' + cont);
    newCircle.setAttributeNS(null,'stroke-width',2);
    newCircle.setAttributeNS(null,'stroke','black');
    newCircle.setAttributeNS(null,'fill','Aqua');
    svg.appendChild(newCircle);

    //cree aiguille heure
    var newLine = document.createElementNS('http://www.w3.org/2000/svg', 'line');
    newLine.setAttributeNS(null, 'id', 'heure' + cont);
    newLine.setAttributeNS(null, "stroke","red");
    newLine.setAttributeNS(null, "stroke-width","4");
    svg.appendChild(newLine);

    //cree aiguille minute
    var newLine = document.createElementNS('http://www.w3.org/2000/svg', 'line');
    newLine.setAttributeNS(null, 'id', 'min' + cont);
    newLine.setAttributeNS(null, "stroke","orange");
    newLine.setAttributeNS(null, "stroke-width","2");
    svg.appendChild(newLine);

    //cree aiguille seconde
    var newLine = document.createElementNS('http://www.w3.org/2000/svg', 'line');
    newLine.setAttributeNS(null, 'id', 'sec' + cont);
    newLine.setAttributeNS(null, "stroke","black");
    newLine.setAttributeNS(null, "stroke-width","1");
    svg.appendChild(newLine);

    //var circle = document.getElementById("circle_horloge");
    var circle = document.getElementById("circle" + cont);
    circle.setAttribute("cx",x);
    circle.setAttribute("cy",y);
    circle.setAttribute("r",diametre);

    //heure
    //var aiguille_heure = document.getElementById("heure");
    var aiguille_heure = document.getElementById("heure"+ cont);
    aiguille_heure.setAttribute("x1",x);
    aiguille_heure.setAttribute("y1",y);
    aiguille_heure.setAttribute("x2",x);
    aiguille_heure.setAttribute("y2",(y-diametre)+diametre/3);

    //minutes
    var aiguille_min = document.getElementById("min"+ cont);
    aiguille_min.setAttribute("x1",x);
    aiguille_min.setAttribute("y1",y);
    aiguille_min.setAttribute("x2",x);
    aiguille_min.setAttribute("y2",(y-diametre)+diametre/5);

    //secondes
    var aiguille_sec = document.getElementById("sec"+cont);
    aiguille_sec.setAttribute("x1",x);
    aiguille_sec.setAttribute("y1",y);
    aiguille_sec.setAttribute("x2",x);
    aiguille_sec.setAttribute("y2",y-diametre);


    setInterval(function(){ 
        var d = new Date(); //date

        var heure_decalage = d.getHours()+decalage;
        var minute = d.getMinutes();
        var seconds = d.getSeconds();

        var heure_calc = (30*((heure_decalage)%12) + (d.getMinutes()/2));
        var minute_calc = 6*minute;
        var seconde_calc = 6*seconds;

        var heure = document.getElementById("heure"+ cont);
        var min = document.getElementById("min"+ cont);
        var sec = document.getElementById("sec"+ cont);

        //title horloge
        document.getElementById("circle"+cont).setAttribute("title", heure_decalage + ":" + minute);

        heure.setAttribute('transform', 'rotate('+ heure_calc +" "+ x +" "+ y +')');

        min.setAttribute('transform', 'rotate('+ minute_calc +" "+ x +" "+ y +')');
        sec.setAttribute('transform', 'rotate('+ seconde_calc +" "+ x +" "+ y +')');
        //setTimeout("r(x,y,diametre,decalage,cont)", 1000); 

    }, 1000)

}

var x = 500;
var y = 250;

var x1 = 200;
var y1 = 100;

var diametre = 100;

var decalage = 0; 

horloge_dynamique('svg01',1,x,y,diametre,decalage);

horloge_dynamique('svg02',2,x1,y1,diametre,decalage);