Question

Here’s the code:

<p><a href="http://foo.com/foo.html"></a>
<a class="foo_blog" href="http://foo.com" target="_blank">bar</a>
:</p>

I want to find and remove any <p> that has an <a> with the class “foo_blog”.

I do not have control over the HTML—it’s coming from elsewhere.

Answer 1

You don’t specify whether the anchor element has to be a direct child of the paragraph or can be further down the tree, so here are some solutions to cover either case. All three will work for the example html you showed.

$("p").has("a.foo_blog").remove();
// OR
$("a.foo_blog").closest("p").remove();
// OR
$("a.foo_blog").parent("p").remove();

The first finds all paragraph elements that have a descendant that is an anchor with that class, and removes such paragraphs.

The second finds the anchors and then goes up to their nearest containing paragraph and removes it.

The last finds the anchors and removes the immediate parent element if and only if it is a paragraph element.

Note that when the paragraphs in question are removed their child element(s) will be removed too.

(The jQuerymethods I used are relatively self explanatory, but for more detail about them you know where to look.)