jQuery: оберните div вокруг p нет: первые элементы внутри div

Question

Я пытался обвести голову вокруг этого, но теперь, похоже, не может думать прямо. У меня есть структура вроде этого:

<div id="team-101"> 
    <p>Description 1</p> 
    <p>Description 2</p> 
    <p>Description 3</p> 
    <p>Description 4</p> 
    <ul><li>Some stuff</li></ul> 
</div> 
<div id="team-202"> 
    <p>Description 1</p> 
    <p>Description 2</p> 
    <p>Description 3</p> 
    <p>Description 4</p> 
    <ul><li>Some stuff</li></ul> 
</div> 

(и т.д.) То, что я хотел бы сделать, это положить второй в последние абзацы текста в DIV, что я мог бы скрыть/показать в пределах каждого основного DIV:

<div id="team-101"> 
    <p>Description 1</p> 
    <div id="desc-101"> 
     <p>Description 2</p> 
     <p>Description 3</p> 
     <p>Description 4</p> 
    </div> 
    <ul><li>Some stuff</li></ul> 
</div> 

Я пытался что-то по

$('div[id^=team-]').each(function() { 
    $('p:first', this).after('<div>'); 
    $('p:last', this).after('</div>'); 

но открытие DIV автоматически закрывается, и не содержит следующую согласно пункту час Это, наверное, детская игра, и я просто слишком тупой.

Answer 1

Цель абзацы, исключить первый, и обернуть их всех с wrapAll

$('div[id^=team-]').each(function() { 
    $('p:not(:first)', this).wrapAll('<div id="'+this.id.replace('team','desc')+'" />') 
}); 

FIDDLE

Answer 2

DOM не работает таким образом, вы не можете вставить открывающий и закрывающий теги отдельно, вы можете выбрать p детей и обернуть все из них с DIV элемента с помощью .wrapAll() метода:

$('div[id^=team-]').each(function() { 
    var n = this.id.replace('team-', ''); 
    $(this).children('p').slice(1).wrapAll('<div id="desc-'+n+'"/>'); 
}); 

http://jsfiddle.net/D7QMe/