jQuery: exclude children from .text() [duplicate]

Question

Given this HTML:

<a href="#" class="artist">Soulive<span class="create-play">Play</span></a> 

I want to get the text content of the a (which is this in the context of my function) without the text content of the span, so I'm left with:

Soulive 

If I do:

$(this).text(); 

I get:

SoulivePlay 

How do I exclude the text content of the span?

Answer 1

A micro-plugin:

$.fn.ignore = function(sel) {   return this.clone().find(sel || ">*").remove().end(); }; 

...having this HTML:

<div id="test"><b>Hello</b><span> World</span>!!!</div> 

will result in:

var text = $('#test').ignore("span").text(); // "Hello!!!" var html = $('#test').ignore("span").html(); // "<b>Hello</b>!!!" 

---

^{if you want it faster and you need only to exclude the immediate children... use .children( instead of .find(}

Answer 2

http://jsfiddle.net/r8kNL/

$(this).contents().filter(function() {   return this.nodeType == 3; }).text()