.appendTo在.bind（加载）中不起作用 - jQuery

Question

我有一个问题，当我在for循环和.bind（“加载”） - 处理程序时，使用.appendTo向div添加图像。我尝试了很多东西，但没有任何效果，它只显示最后的图片，而不是三张。代码非常简单，如下所示。

如果有人提示我，这将是伟大的。提前致谢！

var $images = ["https://static.pexels.com/photos/769986/pexels-photo-769986.jpeg", "https://static.pexels.com/photos/767907/pexels-photo-767907.jpeg", "https://static.pexels.com/photos/746759/pexels-photo-746759.png"];

var i,
  figure,
  img;

for (i = 0; i < $images.length; i += 1) {

  figure = $('<figure />');
  img = $('<img />');

  img.attr("src", $images[i]);

  img.unbind("load");
  img.bind("load", function() {

    a = $('<a>', {
      href: this.src,
      itemprop: "contentUrl",
      'data-size': this.width + "x" + this.height
    });

    img.appendTo(a);
    a.appendTo(figure);
    figure.appendTo('#gallery-panel');
  });
}

img {
  width: 10em;
  float: left;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>

<body>
  <div id="gallery-panel"></div>
</body>

</html>