克隆每个元素后添加换行符

Question

$('.footnote').clone().appendTo('#allfootnotes').append('<br>');

我在整个页面中都有一堆.footnote个元素，在页面底部我想列出页面上的所有脚注。因此，每个脚注将被克隆到#allfootnotes。我正在尝试在.footnote元素中的每个#allfootnotes之后设置一个换行符，所以它们并非全都混杂在一起。

如果将.footnote克隆到#allfootnotes后，我将如何应用换行符？

这是最好的方法吗？在每个.footnote中有2个span标签，一个用于标题，一个用于脚注内容（不知道是否重要）。

Answer 1

听起来你可以使用CSS来做到这一点

#allfootnotes .footnote {
  margin-bottom: 10px;      
}

根据您的情况，您可能需要使用display: block;

制作.footnote块级元素

Answer 2

<强> DEMO

$('.footnote').clone().appendTo('#allfootnotes').after('<br>');

如果您使用的是XHTML，那么它应该是<br />

Answer 3

var allFootNotes = $('#allfootnotes');
$('.footnote').each(function(){
     $(this).clone().add('<br/>').appendTo(allFootNotes);
});

如果您说缓存的脚注数量与$('#allfootnotes')相同，则会减少浏览器的负担。

希望这有帮助

Answer 4

$('.footnote').each(function() {
    $(this).clone().add('<br/>').appendTo('#allfootnotes');
});

编辑请参阅roXon的回答。它比自己在脚注上迭代更清晰。