Chrome扩展程序：使用NodeList数据将元素插入页面

Question

我是创建chrome扩展的新手，我想要做的是使用元素的类名在页面的特定位置插入元素。我知道什么时候做的

document.getElementsByClassName("List-Item"); 

它给了我一个NodeList。我想要做的是使用我的元数据获取列表中每个项目的列表和叠加信息。但试图遍历节点列表将无法正常工作，即

var div = document.createElement('div');
div.style.cssText = 'padding: 5px; position: absolute; color: white; left: 0px; top: 0px;      background: green; height: 50px; width: 50px; z-index: 9999';
div.innerHTML = 'Chrome Plugin Success!';

var foo = document.getElementsByClassName("List-Item");
for(var i = 0; i < foo.length; i++) {
    document.getElementsByClassName("card-content")[i].appendChild(div);
}

有人能指出正确的方法吗？