2

How to remove child element and spaces using jquery?

I have the following content:

<div class="sectionA"> <p>sfadfafdafdafdaf</p>  </div>

If I do:

$(".sectionA *").remove();

I get this:

<div class="sectionA">   </div>

How do I remove the spaces after removing the <p> child element?

kapa
  • 77,694
  • 21
  • 158
  • 175
Yetimwork Beyene
  • 2,239
  • 5
  • 27
  • 33
  • 1
    try `$(".sectionA").empty();` – Ilia G Jan 24 '13 at 21:01
  • 1
    Here is a great script I have used before: http://stackoverflow.com/questions/1539367/remove-whitespace-and-line-breaks-between-html-elements-using-jquery – Red2678 Jan 24 '13 at 21:02

2 Answers2

4

What you need is the .empty() method, which does just what you described:

This method removes not only child (and other descendant) elements, but also any text within the set of matched elements. This is because, according to the DOM specification, any string of text within an element is considered a child node of that element.

Example:

 $(".sectionA").empty();

jsFiddle Demo

kapa
  • 77,694
  • 21
  • 158
  • 175
2

Place an empty string inside it:

 $(".sectionA").html('');
nice ass
  • 16,471
  • 7
  • 50
  • 89