Iterating the article and taking the html with out Its anchor tag

Question

HTML code

<article class="evn-mn-pane">
    <h2><a href="somelink.php">leborium</a></h2>
    <div class="evn-date">20 June, 2013 |  Dr.some name some name1</div>
    <figure>
        <img src="images/events/speakers/no-image.jpg" alt="Dr. Somename"/>
            <figcaption>test link tested some dummy text this...
                <a href="somlink.php">more</a>
            </figcaption>
            <div class="clear"></div>
    </figure>
</article>

<article class="evn-mn-pane">
    <h2><a href="somelink.php">leborium</a></h2>
    <div class="evn-date">20 June, 2013 |  Dr.some name some name1</div>
    <figure>
        <img src="images/events/speakers/no-image.jpg" alt="Dr. Somename"/>
            <figcaption>test link tested some dummy text this...
                <a href="somlink.php">more</a>
            </figcaption>
            <div class="clear"></div>
    </figure>
</article>

Jquery code

$('article').each(function(){
    alert($(this).find('figure > figcaption').html());
});

Result

test link tested some dummy text this...

          <a href="somlink.php">more</a>

Expected Result

test link tested some dummy text this...

Tried this SO link

Tried Code

$('article').each(function(){
    alert($(this).find('figure > figcaption').contents(':not(a)').html());
});

Getting Result

undefined

JSFIDDLE

How to achieve the expected result?any helps are appreciated FYI: I am using jquery1.8.3

UPDATE

I want to take all other tags other then anchor tag, and expecting the result other then using clone method.

Answer 1

contents doesn't take any arguments. This works even if you add more text after the a.

$('article').each(function() {
    var t = $(this).find('figure > figcaption').contents().filter(function() {
        return this.nodeType === 3; //3 = TEXT_NODE
    });
    alert(t.text());

});

Updated JSFiddle

If you want every piece of text within figcaption except the text in a, use this:

return this.nodeType === 3 || this.tagName !== 'A';

Regarding the nodeType property

<a id='a'>asdf</a>

var a = document.getElementById('a');
a.nodeType === Node.ELEMENT_NODE; //true
a.firstChild.nodeType == Node.TEXT_NODE; //true asdf

More on Node types

Answer 2

Find and remove a like this (Updated to not remove link from HTML):

$('article').each(function(){
    var div = $("<div>" + $(this).find('figure > figcaption').html() + "</div>");
    div.find('a').remove();
    alert(div.html());
});

jsFiddle

Answer 3

The text is the first childNode:

$('article').each(function(){
    console.log($(this).find('figure > figcaption')[0].childNodes[0].data);
});

FIDDLE DEMO

Answer 4

This is a quick dirty way to do this. You make a clone and remove all the children. Obviously you can apply filtering to remove certain children only. The code:

$('article').each(function(){
   var $cap =  $(this).find('figcaption')
   .clone()
   .children()
   .remove()
   .end();
   alert($cap.text());
});