包裝jQuery的收集和追加到

Question

類

我有這個集合的21個jQuery的元素

div.article-preview.js - 文章 - 新

div.article-preview.js - 文章 - 新

div.article-preview.js - 文章 - 新 ...

使用此代碼我爲他們追加到頁面。我想知道如何將<div class="row">中的每個第3個元素和<div class="col-sm-12">中的每個元素都包裹起來。我試過使用jQuery.wrap（）函數，但它沒有對附加的html做任何事情。

var newArticles = $('<%= j render partial: "articles/article", collection: @articles %>'); 

var arts = newArticles.filter('.article-preview'); 
arts.addClass('js-articles-new'); 
arts.appendTo($('.js-articles-preview')); 

Answer 1

這應做到：

$('div.article-preview.js-articles-new').wrap('<div class="col-sm-12" />'); 
var divs = $("div.col-sm-12"); 
for (var i = 0; i < divs.length; i += 3) { 
    divs.slice(i, i + 3).wrapAll('<div class="row" />'); 
} 

jsFiddle example

Answer 2

嘗試使用wrapAll（）和slice()

var divs = $("div > div"); 
for(var i = 0; i < divs.length; i+=3) { 
    divs.slice(i, i+3).wrapAll("<div class='new'></div>"); 
}