How do I remove empty <p> tags from a string using JavaScript or Cheerio?

Question

I have some HTML as a string

"<p>This is a slightly longer post about something. Let's see how long this lasts. Okay so this is one paragraph now. </p><p>​</p><p>Let's write another paragraph, and see how it renders when I read this post later. </p><p>​</p><p>This is another short paragraph</p>"

How do I strip the empty p tags from this string using Cheerio or JS.

I've tried searching on Stack Overflow and Google in general without a clear working solution.

EDIT: Apologies, I have just noticed that my string has quite a lot of white space between the tags:

Here's an example one that comes up when I use console.log in my app:

<p>This is a slightly longer post about something. Let's see how long this lasts. Okay so this is one paragraph now. </p>
<p>​</p>
<p>Let's write another paragraph, and see how it renders when I read this post later. </p>
<p>​</p>
<p>Let's write another paragraph, and see how it renders when I read this post later. </p>

Answer 1

In your code in the empty <p> tags you have \u200b (Zero width space) characters. This character stay invisible but is there

You can use split() and join('') methods

var test = "<p>This is a slightly longer post about something. Let's see how long this lasts. Okay so this is one paragraph now. </p><p>​</p><p>Let's write another paragraph, and see how it renders when I read this post later. </p><p>​</p><p>This is another short paragraph</p>";

var str = test.split('<p>​</p>').join('');

console.log(str);

Or you can use replace() method

var test = "<p>This is a slightly longer post about something. Let's see how long this lasts. Okay so this is one paragraph now. </p><p>​</p><p>Let's write another paragraph, and see how it renders when I read this post later. </p><p>​</p><p>This is another short paragraph</p>";

var str = test.replace(/<p>​<\/p>/gi, '');

console.log(str);