javascript - Raphael: Trigger multiple path animations individually -

i have project using raphael draw , animate paths. project intended have multiple divs similar paths, animations trigger on mouseover. @ moment, divs populating properly, animations happening in last div created. how make script distinguish between divs animate them individually?

example html:

<div id="box" class="con1"></div> <div id="box" class="con2"></div> 

example css:

#box {     width: 100px;     height: 50px;     float: left; } .con1 {     background-color:#6634fd; } .con2 {     background-color:#2ba18d; } 

example js:

var divs = document.getelementsbytagname("div");  function init() {     for(var = 0; < divs.length; i++){         var box = divs[i];         var boxheight = box.offsetheight;         var boxwidth = box.offsetwidth;         var paper = raphael(box,boxwidth,boxheight);         var path1 = paper.path("m20,10 l25,0").attr({'stroke-width': 2,stroke:"#ff0000"});         var path2 = paper.path("m21,10 l-25,0").attr({'stroke-width': 2,stroke:"#ff0000"});          box.addeventlistener("mouseover", function() {             paper.setstart();             path1.animate({path:"m20,10 l5,5 l5,-5 l5,5"}, 200);              path2.animate({path:"m21,10 l-5,5 l-5,-5 l-5,5"}, 200);              cat = paper.setfinish();         });         box.addeventlistener("mouseout", function() {             paper.setstart();             path1.animate({path:"m20,10 l25,0"}, 200);             path2.animate({path:"m21,10 l-25,0"}, 200);              cat = paper.setfinish();         });      } }  init(); 

http://fiddle.jshell.net/blueinkalchemist/dneyhvm1/10/

i wonder how many headaches javascript closures have caused... quite few :) code fine, need move inside of loop separate function create new scope since in javascript, closures created on function level, not block level.

for(var = 0; i<divs.length; i++){   creatediv(i); }  function creatediv(i){   var box = divs[i];   ... } 

check out this forked fiddle see working example.

if want read more on closures, reccomend e.g. this question or possibly this one.