setTimeout - Weird behavior

Consider the following HTML:

<html>
    <head></head>
    <body>
        <input type="text" onblur="window.setTimeout('document.title += 2;', 0);" />
        <input type="button" onclick="document.title += 1" />
    </body>
</html>

[Demo with 0 delay, 100ms delay, 150ms delay]

And the following steps:

• User enters the input (focus).
• User clicks the button.

Now, the events would occur on the following order:

• Input Text blur event.
• Button click event.

Testing this on all reachable browsers I get:

document.title = '21' //Expected behavior

But! On production browser (Windows XP + IE 7), I get:

document.title = '12' //Unexpected behavior

I also tried simulating it in IE 7 mode on my local machine (IE 10), couldn't reproduce it tho.

This is obviously a simplified example of the problem I'm having. Otherwise I could simply get rid of the setTimeout.

In the real scenario, the setTimeout call is actually being made by a third party script library (ASP.NET Dev Express Components).

Apart from the actual solution to this problem (which I think I can handle), what explanation could be applied to this behavior?

Update:

Using the expression new Date().getTime() to get the time of each step executed by the browser. It happens as follows:

1387369361417 //document.title += 1
1387369361433 //document.title += 2