Javascript each（）只对最后一个元素起作用

我正在尝试创建一个通过YouTube获取的视频列表。这是我的HTML：

  <ul class="videos-list">
<li>
  <a href="#" class="vid_thumb">
      <img src="http://placehold.it/120x90&amp;text=Loading+.+.+." class="yt_thumb" data-url="http://gdata.youtube.com/feeds/api/videos/f_JRZI9o49w?v=2&amp;alt=jsonc" alt="" />
  <span class="duration">Loading...</span></a>
  <h5><a href="#"></a></h5>
</li>

<li>
  <a href="#" class="vid_thumb">
      <img src="http://placehold.it/120x90&amp;text=Loading+.+.+." class="yt_thumb" data-url=
  "http://gdata.youtube.com/feeds/api/videos/uHUHFthr2QA?v=2&amp;alt=jsonc" alt="" />
  <span class="duration">Loading...</span></a>
  <h5><a href="#"></a></h5>
</li>

下面是javascript：

$(function() {
    /**
     * Set up JSON parsing for video pages
     */
    $("a.vid_thumb").each(function(i) {
        $this = $(this);
        feed_url = $this.children(".yt_thumb").attr("data-url");
        $.getJSON(feed_url, function(json) {
            $title = json.data.title;
            $url = json.data.player.
        default;
            $thumb = json.data.thumbnail.sqDefault;
            $duration = json.data.duration;
            $likes = json.data.likeCount;
            $views = json.data.viewCount;
            $this.next("h5").html("<a href=" + $url + ">" + $title + "</a>");
            $this.children(".duration").html($duration);
            $this.children(".yt_thumb").attr("src", $thumb);
            $this.next("span.view_count").html($views + " Views");
            $this.next("span.upload_date").html($likes + " Likes");
        });
    });
});

$（函数（）{
/**
*为视频页面设置JSON解析
*/
$（“a.vid_thumb”）。每个（功能（i）{
$this=$（this）；
feed_url=$this.children（“.yt_thumb”）.attr（“数据url”）；
$.getJSON（源url，函数（json）{
$title=json.data.title；
$url=json.data.player。
违约
$thumb=json.data.thumbnail.sqDefault；
$duration=json.data.duration；
$likes=json.data.likeCount；
$views=json.data.viewCount；
$this.next（“h5”）.html（“”）；
$this.children（“.duration”）.html（$duration）；
$this.children（“.yt_thumb”）.attr（$src“，$thumb）；
$this.next（“span.view_count”）.html（$views+“views”）；
$this.next（“span.upload_date”）.html（$likes+“likes”）；
});
});
});

脚本应该在类名为“vid_thumb”的所有锚上工作。但它只对最后一个元素有效

---

你可以在这里看到它的作用：我遗漏了什么吗？

是的，这是一个典型的Javascript错误

如果在声明变量时省略

var

关键字，则会将其创建为全局变量

您需要的是每个函数的局部变量，因此请确保在它们前面加上

var

---

请参阅，以获取更新且有效的JSFIDLE。

您需要在变量前面加上

var

关键字，否则它们是全局变量：

---

我在检查持续时间点后添加了一个警报，您的代码似乎也在第二个div中填充了第一个持续时间，并用正确的时间替换它。