Question

I’m running an AJAX query on an external page, and am attempting to only return the data from the County . My current script is pulling the text from all of the table cells, but I cannot for the life of me get it to simply pull the county name.

The current script that is being run:

$( ".zipCode" ).each(function( intIndex ){
var zipCodeID = $(this).attr('id');
console.log('http://www.uscounties.org/cffiles_web/counties/zip_res.cfm?zip='+zipCodeID);
$.ajax({
    url: 'http://www.uscounties.org/cffiles_web/counties/zip_res.cfm?zip='+zipCodeID,
    type: 'GET',
    success: function(res) {
        var headline = $(res.responseText).find("p").text();
        console.log(headline);
        $('#'+zipCodeID).empty();
        $('#'+zipCodeID).append(headline);
    }
});
});

An example of the page that is being queried:
http://www.uscounties.org/cffiles_web/counties/zip_res.cfm?zip=56159

This should work for all entered ZIPS. The page layout is the same, I just can’t get the function to return only the county. Any help or advice would be awesome. Thanks!

Answer 1

With the complete lack of ids and classes on that page, you don’t really have much to go on. If you have access to the source of that page, stick an id or class on the cell and make your life so much easier. If not, you’ll have to use what you know about the structure of the pages to find the county. Something like this will work specifically on that one page you linked to. If other pages have slight variations this will fail:

var headline = $(res.responseText).find("table > tr:eq(2) > td:eq(3)").text();

This assumes that there is only ever one table on the page and that the county is always in the 3rd cell of the 2nd row.