jquery вставить HTML-блок, чтобы он начинался до цели и заканчивался после цели - это возможно?

Question

Я понимаю, что вы можете добавить блоки вставки html до и после цели, используя before(), insertBefore(), after() и insertAfter().

Я пытался сделать что-то похожее на это

<script type="text/javascript">
    $(document).ready(function(){
        $("p").before("<div class='myContainer'>");
        $("p").after("</div>");
    });
</script>

<p>paragraph</p>

Но инъекция, кажется, автоматически создает закрывающие теги для меня, есть ли способ обойти это?

Приветствия

Answer 1

Для этого есть функция :) Используйте .wrap(), например:

$("p").wrap("<div class='myContainer'>");

Это обернет каждую <p> независимую, вы можете увидеть демоздесь , это меняет это:

<p>Paragraph 1</p>
<p>Paragraph 2</p>​

На это:

<div class='myContainer'>
  <p>Paragraph 1</p>
</div>
<div class='myContainer'>
  <p>Paragraph 2</p>​
</div>

Answer 2

Просто упомяните, что вы также можете сделать:

$myDiv = $("<div class='myContainer'></div>");
$("p").wrap($myDiv);

, а затем снова добавить материал в myDiv с помощью

$myDiv.append("This is going to be the text in myContainer");