evento sobre tabla dinamica

[dacroma]

Si, claro, este es el codigo:
Esta es la tabla, que por defecto tiene el encabezado

Código HTML:

<table id="tablaDinamica">
                <caption style="border:groove;">LISTADO DE PRODUCTOS EN EL CARRITO DE COMPRAS</caption>
                <th>
                    PRODUCTO
                </th>
                <th>
                    PRESENTACION
                </th>
                <th>
                    PRECIO
                </th>
                <th>
                    CANTIDAD
                </th>
                <th>
                    SUBTOTAL
                </th>
            </table>
 

El proceso de insercion de los datos en la tabla està bien hecho, es decir los datos se ingresan correctamente.
Este es el codigo JS para obtener las filas de la tabla y aplicar la animacion sobre las mismas.

Código Javascript:

function inicio(){
var tabla=document.getElementById("tablaDinamica");
            var filas=tabla.getElementsByTagName("tr");
            for(i=0;i<filas.length;i++){
            addEvent(filas[i],"mouseover",animacion,false);
            }
}
 
function animacion(){ 
    this.style.webkitAnimationName="animacionTabla";
    this.style.webkitAnimationDuration="0.3s";
    
    this.style.mozAnimationName="animacionTabla";
    this.style.mozAnimationDuration="0.3s";
 }
 

lo de ponerle el color de fondo fuè para simplificar el problema, por que lo que me doy cuenta es que la animacion se aplica es a elementos creados desde el principio, en el archivo html, y lo mismo sucede al quitar la animacion y cambiarle por ejemplo el color de fondo, pero ninguna de las dos aplica sobre los elementos creados dinamicamente.