JS：通过dinamically创建按钮的onclick功能的意外行为

Question

我正在尝试使用0到9之间的按钮创建计算器。我从代码中创建了按钮，我希望0按钮将0附加到显示，1按钮以附加1等。但是，每个按钮都会将3附加到显示屏上。

我做了这个最小的例子来说明问题：

＆＃13;

＆＃13;

var myDisplay = document.getElementById("display");

for (var i=0; i<3; i++){
  var elem = document.getElementById("buttons");
  elem.appendChild(newButtonWithText(i, function(){myDisplay.value += i;}));
}

function newButtonWithText(text,fun){
  var btn = document.createElement("button");       
  var t = document.createTextNode(text);     
  btn.appendChild(t);  
  btn.className= "btn btn-default";
  btn.onclick = fun;
  return btn;
}

＆＃13;

<input id="display"></input>
<div id="buttons"></div>

＆＃13;

＆＃13;

＆＃13;