I've dynamacally added the circle elements to the svg displayed in a iFrame. Chrome isnt showing the new elements, not tried FF yet. Is there somekind of redraw/refresh I need to call? The first circle is actually in the svg document, the rest come from script.

<iframe id=svgFrame src=xmlfile1.svg width=300 height=300>

<svg xmlns=http://www.w3.org/2000/svg id=SVG1 width=200 height=200>

   <circle cx=20 cy=20 r=5/>

   <circle cx=165 cy=80 r=32/>

   <circle cx=15 cy=38 r=32/>

   <circle cx=140 cy=39 r=30/>

   <circle cx=178 cy=32 r=22/>

   ...etc

   <circle cx=166 cy=130 r=16/>

</svg>

</iframe>

The javascript which creates the elements:

function RandomNumber(min, max) {

    var r;

    r = Math.floor(Math.random() * (max - min + 1)) + min;

    return r;

}



var svg = document.getElementById(svgFrame).contentDocument;



for (var i = 0; i < 99; i++) {



    var n = svg.createElement(circle);

    n.setAttribute(cx , RandomNumber( 0 , 200) );

    n.setAttribute(cy , RandomNumber(0, 200) );

    n.setAttribute(r  , RandomNumber(5, 35) );



    svg.documentElement.appendChild(n);

}