javascript - 动态添加时SVG没有动画

Question

如果我动态添加 SVG，它不会在某些浏览器上设置动画。我花了一段时间才找到问题所在。这是我可以用来说明问题的最简单的例子。

我的 jsFiddle

window.setTimeout(function() {
    document.getElementById("content").innerHTML = "<svg width='100' height='100'><circle cx='50%' cy='50%' r='50' fill='red'><animateColor id='a1' attributeName='fill' values='blue;green;yellow;orange;red;blue' dur='5s' repeatCount='indefinite' /></circle></svg>";
}, 0);

它适用于 Chrome 和 Safari 6.1 Seed，但不适用于 Safari 6.0 或Firefox。

编辑：iOS 6 上的 Safari 存在同样的问题，但它确实适用于 iOS 7 Beta 上的 Safari。