Q:

svg animation - error Cannot read property 'getTotalLength' of null

i have made this svg text animation http://jsfiddle.net/thLvLkq0/2/
function init(i) {
    path[i] = document.getElementById('path'+i);
    length = path[i].getTotalLength();
    path[i].style.transition = path[i].style. WebkitTransition = 'none';

    length[i] = length;
    path[i].style.strokeDasharray = length + ' ' + length;
    path[i].style.strokeDashoffset = length;

    path[i].getBoundingClientRect();
}

chrome browser returns this error message Cannot read property 'getTotalLength' of null
is there any way to solve it?  i can't make it work. 

A:

You get this because it's looking for an element with the id of path3, however you only have path1 and path2.  You can stop the for loop by changing for(var i=1; i<=3; i++) to for(var i=1; i<3; i++).