Extract href with particular text

Question

I have several a tags being generated dynamically in a enterprise application like below

<a href='JavaScript:SWESubmitForm(document.SWEForm1_0,s_1,"s_1_1_1_0","1-SXPINW")' onclick='Edit_SList__0__Control__Renew_SPO__onclick(null, "s_1_1_1_0")'  tabindex=2997  id='s_1_1_1_0'>Renew PO</a>
<a href='JavaScript:SWESubmitForm(document.SWEForm1_0,s_2,"s_1_1_4_0","1-SXP9NW")' onclick='Edit_SList__0__Control__XRXAddFunds__onclick(null, "s_1_1_4_0")'  tabindex=2997  id='s_1_1_4_0'>Add Funds</a>

I have following jQuery code to extract unique value identifying the record from tag

var href = $('a[href*="SWESubmitForm"]').attr('href');
var rowId = "";
    if( href != ""){
        hrefAr =  href.split('","');
        rowId = hrefAr[hrefAr.length - 1];
        rowId = rowId.substr(0,(rowId.length - 2));
    }

The above code gives me the value 1-SXPINW but I need to get value 1-SXP9NW (2nd link and there could several links on one page). I need to add filter for the text basically retrieve only the value for the link with particular text such as "Add Funds".

I know it is possible to use each and add if statement to check text but I would like to do it through filter.

Please help!!!

EDIT:

I think I didn't explain the problem properly. I need to setup filter in such a way that

if (text within a tag == "Add Funds") then get the value of ID within href attribute

I would like setup my filter based on the text() within a tag. I hope it clarifies the problem a bit better.

Answer 1

Select the element you want.. If there is two of them just use .eq() since it returns all elements that match your selector- .eq will return a jquery object

var href = $('a[href*="SWESubmitForm"]').eq(1).attr('href'); // <-

or convert it to dom element

var href = $('a[href*="SWESubmitForm"]')[1].href; 

Also since you have an ID you can just select the one you want with the ID selector

var href = $('#s_1_1_4_0').attr('href');

Or if there's too many and you need to find the one with 9NW.. just use indexOf in your check

$('a[href*="SWESubmitForm"]').each(function(){
     var rowId = ""; 
     if(this.href.indexOf('1-SXP9NW') > -1){ // <-- use indexOf to see if href contains the string                  
         hrefAr =  this.href.split('","');
         rowId = hrefAr[hrefAr.length - 1];
         rowId = rowId.substr(0,(rowId.length - 2));    
     }
});

With filter function

var href = $('a[href*="SWESubmitForm"]').filter(function(){
         return this.href.indexOf('1-SXP9NW') > -1;
}).attr('href');   

After all this.. Why don't you just use this selector?

$('a[href*="1-SXP9NW"]')

EDIT:

If Add Funds is static.. then use the :contains() selector

var href = $('a:contains("Add Funds")').attr('href');

Answer 2

You can use .each() to loop through your links and extract the value you need from the href attribute.

$('a[href*="SWESubmitForm"]').each(function() {
    var rowId = "";
    var href = $(this).attr('href');
    if (href != "") {
        hrefAr = href.split('","');
        rowId = hrefAr[hrefAr.length - 1];
        rowId = rowId.substr(0, (rowId.length - 2));
        console.log(rowId);
    }
});​