数组在console.log中显示为undefined，即使它具有全局范围

Question

$(document).ready(function() {
    var arr = [], input;

    $('#add').click(function() {
        input = $('#input').val();
        arr.push(input);

    });
    console.log(arr);
});

上面的代码在控制台中没有显示任何内容，但是当我在console.log(arr);行下面移动arr.push(input);行时突然显示数组。这是怎么回事？

如果它有帮助，这里也是html代码。

<form action="#">
    <input type="text" id="input">
    <input type="submit" value="Add" id="add">
    <input type="submit" value="Display" id="display">
</form>

我需要在click函数之外使用该数组，以便我可以在显示单击功能中使用它来在页面上显示数组。

这个问题与异步无关，请不要将其标记为重复。这是一个简单的问题，需要一个简单的答案。