jQuery remove empty p tags

Glenn Glenn's Blog 2 Comments

In content management systems like WordPress we often find that the system auto-generates <p></p> tags. That’s a real annoyance as it adds empty space amongst layouts. Here’s a simple jQuery snippet we often use to remove this:-


&lt;script type=&quot;text/javascript&quot;&gt;
jQuery(document).ready( function($) {

	// remove the empty p tags
	$('.entry-content p').each(function() {
    var $this = $(this);
    if($this.html().replace(/\s|&amp;nbsp;/g, '').length == 0)
        $this.remove();
});
});
&lt;/script&gt;

In our example we are targeting “.entry-content’, but this can be applied to any div.

Let us know how you get on.

About the Author
jQuery remove empty p tags jQuery remove empty p tags 0da77002febbfe28d15144a57bbcc2c9 s 180 d mm r g

Glenn

A highly experienced WordPress Web Developer, Front-end and Back-end Developer & New Media Specialist with extensive knowledge of a wide spectrum of technologies in the Development and Creative Industries built up over a number of years.

Comments 2

  1. Post
    Author

    This can be applied to any div/dom element so yes you can apply this to Joomla also. Simply make sure you substitute .entry-content for the element you are targeting.

Leave a Reply

Your email address will not be published. Required fields are marked *