Change external SVG text with javascript -

i'm having issue changing text in external svg. i've found number of solutions listed here none of them have worked.

adding listener:

document.getelementbyid('id1').addeventlistener('onload', func); 

the function:

function func () {      var ele = document.getelementbyid('id1'),         svg = ele.contentdocument,         p = svg.getelementbyid('id2');      alert(p.textcontent);     p.textcontent = 'test';  } 

the first time load it, p returns null. on second load alert returns correct text within svg text element text not updated next statement.

why not working on first load , why text not changing

<svg height="90" width="200">   <text x="10" y="20" style="fill:red;">several lines:     <tspan x="10" y="45">first line.</tspan>     <tspan x="10" y="70">second line.</tspan>   </text>   <text x="40" y="60">more text</text>   <text>will not display x , y missing</text> </svg> 

you need set x , y attribute element displayed. alert should happen after set value of text element:

p.textcontent = 'test'; alert(p.textcontent);