Pure Javascript - custom js css selector for timed actions

Question

So I have the following code:

function moveIt(var1,var2,var3){
    document.getElementById(var1).style.var2 = var3;
}

And then call it using

window.setTimeout("moveIt('square','backgroundColor','blue')",1500);

But it stays the same. Changin var2 to backgroundColor in the first code makes it work.

What can I do to solve it?

Thanks.

possible duplicate of [Dynamic object property name](http://stackoverflow.com/questions/4244896/dynamic-object-property-name) — Bergi, Aug 29 '13 at 13:03
You need to use [bracket notation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Member_Operators): `….style[var2]`. And don't pass strings to [`setTimeout`](https://developer.mozilla.org/en-US/docs/Web/API/window.setTimeout), pass functions! — Bergi, Aug 29 '13 at 13:04
@user2075203:remove that solved from title..just accept the answer you think is correct.. — HIRA THAKUR, Aug 29 '13 at 15:05

score 3 · Answer 1 · edited May 23 '17 at 12:05

3

Try this

 document.getElementById(var1).style[var2] = var3;

It's an applied version of this concept.

edited May 23 '17 at 12:05

Community

answered Aug 29 '13 at 13:02

Nick

score 2 · Answer 2 · answered Aug 29 '13 at 13:02

2

try

window.setTimeout(function(){moveIt('square','backgroundColor','blue')},1500);

with

function moveIt(var1,var2,var3){
    document.getElementById(var1).style[var2] = var3;
}

answered Aug 29 '13 at 13:02

Moazzam Khan

2 Answers2