using .each with closest()

Question

I am trying to loop through a bunch of fields in a form and need to change the link text.

My desired result is

Alert("Second 1");
Alert("Second 2");

Example code:

<div class="text-wrapper">
    <input class="field-text" value="">
</div>
<div>
    <ul>
        <li><a href="" class="first">First</li>
        <li><a href="" class="second">Second 1</li>
    </ul>
</div>
<div class="text-wrapper">
    <input class="field-text" value="">
</div>
<div>
    <ul>
        <li><a href="" class="first">First</li>
        <li><a href="" class="second">Second 2</li>
    </ul>
</div>

<script>
jQuery(document).ready(function() {
        jQuery(".text-wrapper").each(function(){
            var value = jQuery(this).closest("a.second").text();
            alert(value);
        });
});
</script>

Answer 1

closest finds the parent that matches the selector, not the child.

You want find instead.

EDIT: find won't work, as the tag your looking for isn't a child of text-wrapper. You need to manually traverse the DOM to find the element.

jQuery(this).next('div').find("a.second").text();