JavaScript Animations: value of changed property after animation? -

i have javascript code slides div left right changing 'left' css property when mouse clicked on div. code working fine. initially, div's 'left = 0' suppose want slide div random number. like.

function move(){   var final = math.random()*100  //lets suppose final gets value equal 145 in case    ....code sliding goes here  } 

so, div's left should equal 145px now.

now, when click on div again, happen:

function move(){  var final = math.random()*100  //lets suppose final gets value equal 30 in case    ....code sliding goes here  } 

now, shouldn't div slide 145px 30 px? because when clicked on div first time left became 145 px , no longer remains 0. in case happens when click on again, first goes 0 px , moves 30px.

this sounds lot easier transition:

css:

.moving_element {transition:all 0.4s ease; -webkit-transition:all 0.4s ease;} 

(replace class needed code)

js:

elem.style.left = math.random()*100+"px"; 

that's need. browser smoothly move element 1 position next in defined time.