在为onclick函数创建按钮时会被覆盖

Question

我有一个ajax，它基于一些json数据加载了一些按钮

$.ajax({
    type: "GET",
    url: "/some/",
    dataType: 'json',
    success: function(data) {
        for(var i = 0; i < data.cities.length; i++)
        {
            var button = document.createElement("button");
            var a = data.cities[i].a;
            var b = data.cities[i].b;
            button.onclick = function() { alert(a + ', ' + b); };
            button.innerHTML = a + ', ' + b;
            $("#div").append(button);
        }
    }
});

json中的每条记录都与加载的按钮上显示的不同，但是当我单击其中的任何一个时，都会显示来自上一条记录的警报。据我了解，循环的每个步骤都会覆盖所有已创建按钮的onclick函数，但我无法弄清楚为什么以及如何解决它。有人知道这是什么问题吗？