Check if any tags have a certain inner HTML

Question

How would i write a jquery function that returns true if any spans within a div with id 'word' have an inner HTML of value v? For the selector, I have:

$('#word span').html()

I'm confused as to the correct way to iterate through them, and return a boolean value because currently i have 5 span tags within that div.

Answer 1

You could use :contains as in $("#word span:contains(v)"), but that selects spans that contain 'v' rather than have it as an exact value. .html only returns the html string of the first element selected, so you probably want to iterate with .each and do an exact comparison:

var count = 0;
$("#word span").each(function () {
   if ($.trim($(this).text()) === 'v') {
      count++;
   }
});

Answer 2

You can use filter method:

$("#word span").filter(function () {
      return this.innerHTML === v; // in case that v is a variable
      // return $(this).text() === 'v';  
}).length;