I have an html that has a div with particular class and text (in the case of the html file I am trying to work on: "All Information (Senate Website)" and the class is field__label. This particular div has a sibling or next element class "field__item" and this class field__item has a child a href. I am interested in getting the value of href attribute. How do I that with html below.
<div data-quickedit-field-id="node/80559/field_a/en/full" >
<div >All Information (Senate Website)</div>
<div ><a href="http://legacy.senate.gov.ph/lis/bill_res.aspx?congress=14&q=SBN-97">View</a></div>
</div>
What works for me is using the .html function (see code below) but with this code, it is giving me: <a href="http://legacy.senate.gov.ph/lis/bill_res.aspx?congress=14&q=SBN-97">View</a>
. I am only interested with http://legacy.senate.gov.ph/lis/bill_res.aspx?congress=14&q=SBN-97
jQuery(document).ready(function($){
url_sb_all = $( "div.field__label:contains('All Information ')").nextAll().html();
alert (url_sb_all);
});
Using innerHTML, it is giving me undefined. And using like the one below, it is also giving me undefined.
jQuery(document).ready(function($){
var url_sb_all = $("div.field__label:contains('All Information ')" > "div.field__item a:contains('View')").prop('href');
alert (url_sb_all);
});
CodePudding user response:
This is as simple as I can get it
const url = $(".field__label:contains('All Information (Senate Website)')") // the div containing your text
.next() // the next sibling
.find("a") // the link in that sibling
.prop("href"); // prop() or attr()
console.log(url)
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<div data-quickedit-field-id="node/80559/field_a/en/full" >
<div >All Information (Senate Website)</div>
<div ><a href="http://legacy.senate.gov.ph/lis/bill_res.aspx?congress=14&q=SBN-97">View</a></div>
</div>