jQuery :contains(), but to match an exact string

Question

As said in the title, I'd like to find something like :contains() but to match an exact string. In other words, it shouldn't be a partial match. For example in this case:

<div id="id">
   <p>John</p>
   <p>Johny</p>
</div>

$("#id:contains('John')") will match both John and Johny, while I'd like to match only John.

Thanks in advance.

_{EDIT: ES2015 one-liner solution, in case anyone looked for it:}

const nodes = [...document.querySelectorAll('#id > *')].filter(node => node.textContent === 'John');

console.log(nodes);

/* Output console formatting */
.as-console-wrapper { top: 0; }
.as-console { height: 100%; }

<div id="id">
  <p>John</p>
  <p>Johny</p>
</div>

Answer 1

You could try writing a Regular Expression and searching off of that: Regular expression field validation in jQuery

Answer 2

Simple way is "select element by exact match" using pseudo function.

Solution Select element by exact match of its content

Answer 3

You can use filter for this:

$('#id').find('*').filter(function() {
    return $(this).text() === 'John';
});

---

Edit: Just as a performance note, if you happen to know more about the nature of what you're searching (e.g., that the nodes are immediate children of #id), it would be more efficient to use something like .children() instead of .find('*').

---

Here's a jsfiddle of it, if you want to see it in action: http://jsfiddle.net/Akuyq/

Answer 4

jmar777's answer helped me through this issue, but in order to avoid searching everything I started with the :contains selector and filtered its results

var $results = $('#id p:contains("John")').filter(function() {
    return $(this).text() === 'John';
});

Heres an updated fiddle http://jsfiddle.net/Akuyq/34/