javascript - 正确地在 div 内附加和设置标签和跨度的样式

Question

我在这个 fiddle 中做错了什么？ Fiddle

我想要完成的是在另一个 div 中有多个 div，其中有标签和 span。标签必须位于左侧，跨度文本位于右侧，并在每个 div 底部用实心边框将它们分开。

在上面的 fiddle 中，我什至无法将背景设置为 div 的颜色。像这样的事情:

<div class="standards">
     <div class=""><label></label><span><span></div>
     <div class=""><label></label><span><span></div>
     <div class=""><label></label><span><span></div>
</div>

所以最终结果应该是这样的

HTO    some text
__________________

HTO    some text
__________________

Answer 1

$('.tab_field_pair') 选择具有相应类的所有 html 节点。因此，当您附加第一个并想要附加第二个时，它会选择两个 div。

您可以执行以下操作:

var code = "HT0";
var label = 'evaluate the social, political, economic, and cultural contributions of individuals and groups from various societies, past and present'

var length = 5;

for (var i = 0; i <= length; i++){
var $div=$("<div class='tab_field_pair'> </div>");
$('.standards').append($div);
$div.append("<label id='standardscode'>" + code + "</label><span id='standardslabel'>" + label + "</span>")
}

http://jsfiddle.net/2dJAN/1351/