Убрать определенный тег из родительского (jQuery)

Question

HTML:

<div class="featured">
    <h4><a href="#">Title 1</a></h4>
    <a href="#"><img src="image.png" class="image"/></a>
    <p><a href="#"></a><br />
    Description goes here</p>
</div>

<div class="featured">
    <h4><a href="#">Title 2</a></h4>
    <a href="#"><img src="image.png" class="image"/></a>
    <p><a href="#"></a></p>
    <p>Description goes here</p>
</div>

.. Как удалить все теги <p> из .featured?

Спасибо

Answer 1

Выезд Развертывание Бена Алмана "плагин"

$.fn.unwrap = function() {
  this.parent(':not(body)')
    .each(function(){
      $(this).replaceWith( this.childNodes );
    });

  return this;
};

ваше использование будет:

* +1007 *

Answer 2

Это работает, но только потому, что ваши элементы абзаца находятся в конце ваших div:

$(".featured p").each(function(){
    var content = $(this).html();
    $(this).parent().append(content);
    $(this).remove();
});

Answer 3

С помощью jQuery 1.4 вы можете сделать это следующим образом:

$(".featured p *").unwrap();
$(".featured p").each(function(){
  $(this).replaceWith("<span>"+ $(this).text() + "</span>")
});

Проверьте это здесь

Текстовые узлы не распаковываются, поэтому их нужно делать отдельно. Я не уверен, почему replaceWith требует, чтобы они были внутри тегов.

Answer 4

Как то так?

$(".featured p").each(
  function(){
    $(this).after($(this).html()).remove();
});

Редактировать 2: Проверено, работает. красиво и просто.

Answer 5

$(".featured p").remove();

Это работает, изменяя каждый <p> на <span>. Он делает это на месте, поэтому <p> s не обязательно должны быть в конце (без добавления - это не будет изменять порядок элементов):

$(".featured p").replaceWith(function(){
     return $('<span />').html( $(this).html() );
});

Он использует html, поэтому элемент потеряет привязки данных и событий.