Javascript 封装与div共享同一类的同级元素[一次两个]

我有十个同级元素，它们的类是

，
标记类似于：

<div class='book'>
    <div class='post text'>one</div>
    <div class='post photo'>two</div>
    <div class='post quote'>three</div>
    <div class='post video'>four</div>
    <div class='post audio'>five</div>
    <div class='post link'>six</div>
    <div class='post text'>seven</div>
    <div class='post video'>eight</div>
    <div class='post quote'>nine</div>
    <div class='post link'>ten</div>
</div>

这是用于tumblr布局的。我想让布局看起来像一本书，你可以在里面翻阅文章，比如一页一页

我在尝试不使用
.post的包装器
div
时，遇到了
z-index
和
transition
的一些问题

我举了十个例子。页面上可能有1-10个
.post
s，因此，如果页面上有奇数个
.post
s，则最后一个封装的
div
应该只包含一个
.post

jsfiddle：

谢谢你的帮助
 可以使用
.wrapAll（）
方法完成：

$('.post').each(function (i) {
    if (!(i % 2)) $(this).next('.post').addBack().wrapAll('<div class="page"/>');
});

$（'.post'）。每个（函数（i）{
if（！（i%2））$（this.next（'.post'）.addBack（）.wrapAll（''）；
});

var posts=$（'.post'）；
对于（变量i=0；i
沃尔夫的答案非常简洁，我从中学到了很多

以下是我尝试的，冗长的一个：）

$（文档）.ready（函数（）{
var book=$（'.book'）；
var postgroups=[]；
var positems=[]；
var addItems=函数（）{
var grpDiv=$（''）；
$（grpDiv）。追加（positems）；
positems=[]；
组后推（grpDiv）；
}
$（'.post'）。每个（函数（索引，项）{
positems.push（项目）；
如果（（索引+1）%2==0）{
addItems（）；
}
});
如果（positems.length>0）{
addItems（）；
}
如果（postgroups.length>0）{
$（book.empty（）；
$（书本）.附加（postgroups）；
}
});
太棒了！在我接受你的答案之前，让我先玩几分钟演示！（我心里已经接受了）。这很合适，A.沃尔夫！万分感谢！：）A.沃尔夫的答案更简洁谢谢你，萨米，你的答案确实有效，但A.沃尔夫的答案似乎是更好的解决方案。干杯！：）
$('.post').each(function (i) {
    if (!(i % 2)) $(this).next('.post').addBack().wrapAll('<div class="page"/>');
});

var posts = $('.post');
for(var i=0; i < posts.size(); i+=2) {
    var group = $(posts.get(i)).add($(posts.get(i+1)));
    group.addClass('group');
    $('.group').wrapAll('<div class="page" />');
    group.removeClass('group');
}

$(document).ready(function () {
    var book = $('.book');
    var postgroups = [];
    var postitems = [];
    var addItems = function () {
        var grpDiv = $('<div class ="page"/>');
        $(grpDiv).append(postitems);
        postitems = [];
        postgroups.push(grpDiv);
    }
    $('.post').each(function (index, item) {
        postitems.push(item);
        if ((index + 1) % 2 == 0) {
            addItems();
        }
    });
    if (postitems.length > 0) {
        addItems();
    }
    if (postgroups.length > 0) {
        $(book).empty();
        $(book).append(postgroups);
    }
});