Find html element by content and hide using jQuery

Question

I am trying to use jquery to find some elements in some HTML, I would like to find and hide the list id that contains the label text 'This is my test label' and 'Yest another test label

<ul id="mylist" class="top_level_list">
<li id="field66" class="myfield">
    <div class="field_icons">
        <div class="title">This is my title</div>
    </div>
    <label class="my_label" for="input71">This is my test label</label>
</li>
<li id="field20" class="myfield">
    <div class="field_icons">
        <div class="title">This another test title</div>
    </div>
    <label class="my_label" for="input71">Yet another test label</label>
</li>

I have found the jQuery .hide function as well as the .find() function but i'm unsure as to how to select the element using the content within it.

Can anyone help?

Answer 1

This is a slightly easier solution. $(".my_label:contains('This is my test label')").hide();. You can see it in action here: http://jsfiddle.net/kPxTw/

Answer 2

Have a look here: http://jsfiddle.net/yPFgu/1/

CODE

var labelsToHide = ["This is my test label", "Another one"];

$("li").each(function () {
    var txt = $(this).find("label").text();
    if (labelsToHide.indexOf(txt) > -1 )
        $(this).hide();
});

Hope it helps.