jquery - jQueryは、要素名を使用して配列を作成し、複数回表示されます

Question

このコードでは、要素名を使用して配列を作成していますが、1回だけ表示するのではなく、配列を4回表示しています。私は今何を間違っていますか？

HTML

<ul>
    <li><a draggable="true" href="#" id="one" name="uno" class="imgHvr">One</a></li>
    <li><a draggable="true" href="#" id="two" name="dos" class="imgHvr">2</a></li>
    <li><a draggable="true" href="#" id="three" name="tres" class="imgHvr">three</a></li>
    <li><a draggable="true" href="#" id="four" name="sweet" class="imgHvr">4</a></li>
</ul>

jQuery

$("#subBtn").click(function() {
    var answers = []
    $('#bin a').each(function() {
        answers.push($(this).attr('name'));
        console.log(answers);
    })
});

ここに完全なコードを投稿しましたデモ

Answer 1

回答フォーム：

$("#subBtn").click(function() {
    var answers = []
    $('#bin a').each(function() {
        answers.push($(this).attr('name'));
    })
    console.log(answers);
});