Find closest span text?

Question

I feel like this would be simple enough, but I'm clearly missing something. When clicking an "X" icon for each panel-title, I need to capture that title, like "CUSTOMER" for example. Maybe it's because my span is in another A tag? I need to know the name on the panel-title so I can tell the database which attribute to remove. Thanks in advance.

jQuery

$('.fa-times').click(function(){
    //alert('Delete this panel-title')
    alert($(this).closest('span.jumpScreen').text())
})

HTML

<h4 class="panel-title">
    <a class="accordion-toggle pad" data-toggle="collapse" data-parent="#accordion2" href="#collapse_0">
        <i class="fa fa-chevron-down disabledArrow">&darr;</i>
    </a>
    <a href="" target="_blank">
        <span class="jumpScreen">CUSTOMER</span>
    </a>
    <a class="attrDel" onclick="attrDel(this.id)" id="del_0">
        &nbsp;<i class="fa fa-times">X</i>
    </a>
</h4>
<h4 class="panel-title">
    <a class="accordion-toggle pad" data-toggle="collapse" data-parent="#accordion2" href="#collapse_0">
        <i class="fa fa-chevron-down disabledArrow">&darr;</i>
    </a>
    <a href="" target="_blank">
        <span class="jumpScreen">ATTRIBUTES</span>
    </a>
    <a class="attrDel" onclick="attrDel(this.id)" id="del_0">
        &nbsp;<i class="fa fa-times">X</i>
    </a>
</h4>

http://jsfiddle.net/4jwao0pt/

Answer 1

There is no closest span, the span is in an anchor that is a sibling of the parent anchor the i element is in

$('.fa-times').click(function(){
    var elem = $(this).closest('a').prev('a').find('span.jumpScreen');

    alert( elem.text() );
});