Edit: I ultimately want to use setTimeout to restore a previous value of a variable at a later time

I created the following example to illustrate my point: ([JSFiddle](http://jsfiddle.net/marsguy/dwzxjco6/3/))

```
<!DOCTYPE html>
<html>
<body>
<p>Push the button</p>
<button id = "push">Try it</button>

<script>
var x = {};
x.boo = "foo";
function myFunction() {
    alert(x.boo);
}
document.getElementById('push').addEventListener('click',function() {
    setTimeout(function() {
        myFunction(x)
    }, 1000);

    x.boo = 'baz'; //eg. something else modifies x before first timer runs out
    // another timer gets created, should reflect new value in x
    // added delay is just to keep track of the order myFunction is being executed
    setTimeout(function() {
        myFunction(x)
    }, 3000);
},false‌​);
</script>
</body>
</html>

```

What happens:
-------------

After clicking button, alert() window shows 'baz' after 1 second, then 'baz' after 3 seconds.

What I want to happen:
----------------------

After clicking button, alert window should show 'foo', then after 3 seconds show 'baz'.

I've tried wrapping the myFunction callback in another anonymous function sent to setTimeout, as well as tried passing in params instead, both of which do not change behavior.

In my app, jQuery library is loaded so I also have that at my disposal if needed.