在JQuery Each循环中修改变量

Question

我是Javascript的一个完整的初学者。我正在尝试使用jQuery's $ .each函数来迭代JSON文件。我试图修改$ .each循环内的变量。但是，这种修改的效果并未在循环之外显示。请在下面查看我的代码-打印到控制台的所有内容都是<table> </table>，但是我希望它打印更多内容（由于我在$ .each循环中进行了修改）。我想知道这是否与变量作用域有关-我确实查看了this有关作用域的详细线程，但无法解决我的问题。

这是我的代码：

var out = '<table>'
$.getJSON( "../test.json", function( data ) {
    var i = 1;
    $.each( data, function( key, val ) {
        if (i % 2 == 1){out += '<tr> ';}
        out += '<td width=50%> ' + val + '</td>';
        if (i % 2 == 0){out += ' </tr>';}
        i += 1;
    });
});
out += '</table>'
console.log(out);