Question

I need to delete everything (text and other elements) before and after the element <a> with value class chatlink.
All this, within each element <div> with value class main.

But only if <div> element with the value main contains a link with the value of chatlink.

For example:

<div class="main">
    Bla bla bla :)
    <a href="#" class="chatlink"><img src="#" /></a>
    bla bla bla ...
    <a href="#" class="chatlink"><img src="#" /></a>
    tra la la la laaa
    <a href="#" class="postlink">some text</a>
    tralalaaa
</div>

Final code:

<div class="main">
    <a href="#" class="chatlink"><img src="#" /></a>
    <a href="#" class="chatlink"><img src="#" /></a>
</div>

Is it possible?

Answer 1

Search for all the text node within .main container using filter() and use remove() to remove them from the container or dom.

$('div.main:has(.chatlink)').contents().filter(function(){
   return this.nodeType == 3 || !$(this).hasClass('chatlink');
}).remove();​

Working demo – http://jsfiddle.net/ShankarSangoli/Amjaq/3/

Note that I am using contents() method on $('.main') which gets the children of each element in the set of matched elements, including text and comment nodes. If you use any other find mechanism then textnodes are not considered.