在jQuery中，如果我有一个开始和结束类，我怎么能用div包装多个元素

Okay so here is some html. I have a few start and end classes but for the sake of this I have only added 1 of each.

好的，所以这里有一些HTML。我有一些开始和结束类，但为了这个我只添加了1个。

<div id="DaySchedule_5amDetail">
    <span>&nbsp;</span>
</div>
<div id="DaySchedule_6amDetail">
    <span>&nbsp;</span>
</div>
<div id="DaySchedule_7amDetail" class="start"> <-- start
    <span>&nbsp;</span>
</div>
<div id="DaySchedule_8amDetail">
    <span>&nbsp;</span>
</div>
<div id="DaySchedule_9amDetail">
    <span>&nbsp;</span>
</div>
<div id="DaySchedule_10amDetail" class="end"> <-- end
    <span>&nbsp;</span>
</div>
<div id="DaySchedule_11amDetail">
    <span>&nbsp;</span>
</div>

I am trying to have jquery wrap elements from class start to class end in a div

我试图在div中从类start到class end获得jquery包装元素

I have tried many different things and looked through *.

我尝试了很多不同的东西，并通过*查看。

$('div.start').each(function(){
   $(this).nextUntil('div.end').wrap(document.createElement('div'));
});

This from what I have found should work but it does nothing. It doesn't even create a div

我发现的这应该可行，但它什么都不做。它甚至没有创建div

$("div.start").wrapAll("<div>");

this creates a div around only the element with class start I want to extend it till class end.

这会创建一个只有class start的div，我想将它扩展到class end。

Is there a clear way to do this? Should I not even bother with wrap or wrapAll? Is there a way to inject an open div tag before an element with a certain class and add a closing tag after an element with a certain class (start and end). I have tried preappend and append with no luck.

有没有明确的方法来做到这一点？我甚至不打扰包裹或wrapAll？有没有办法在具有特定类的元素之前注入一个开放的div标签，并在具有特定类（开始和结束）的元素之后添加一个结束标记。我试过preappend并附加没有运气。

Any help would be greatly appreciated. Thank you.

任何帮助将不胜感激。谢谢。

Edit: --------------------------------------------------------

编辑：------------------------------------------------ --------

The selected answer pretty much worked for me with some little manipulation so here is the code that worked for me:

选择的答案对我来说非常有用，只需要一些操作，所以这里的代码对我有用：

  $('.start').each(function(){
    var $nextGroup = $(this).nextUntil('.end').add(this);
    $nextGroup.add($nextGroup.next()).wrapAll('<div class="draggableStuff">');
});

1 个解决方案

#1

You were pretty close.... you do want wrapAll() but using the nextUntil() concept you have.

你非常接近....你确实想要wrapAll（）但是使用你拥有的nextUntil（）概念。

$('.start').each(function(){
    $(this).nextUntil('.end').wrapAll('<div class="wrapper">');
});

DEMO

DEMO

If you need to also wrap the start and end use add() to add the start and end elements:

如果你还需要包装开始和结束使用add（）来添加开始和结束元素：

$('.start').each(function(){
     var $nextGroup= $(this).nextUntil('.end')
     $nextGroup.add(this).add($nextGroup.next()).wrapAll('<div class="wrapper">');
});

DEMO 2

演示2

#1