jQuery load html - how to get last table returned

Question

I am somewhat new to jQuery but have been having fun trying learn about all the cool tricks it can do. One of the current things I am trying to use is the load function to get a weather report from one the sites we use for daily reporting. The code I am using is

$(document).ready(function() {
$("#table").load("weather_url table");
});

This works just like I expected and returns all tables. The problem I am having is that none of the tables have an ID tag, so I get all the tables in the page. I need to get only one table that has the weather information in it. I am not sure how to target the one I need. Is this even possible without IDs? I have also tried using

$('table:last-child').show();

But it still shows all the tables.

Thanks for the help with this!

Answer 1

Use

$('#table:last-child').show();

I assumed that the visibility of all tables loaded are hidden and you just want to show the last table.

Answer 2

there is a function in jquery that gives you the nth item

http://api.jquery.com/eq-selector/

Answer 3

You should be able to do it directly in the selector after the url. See "Loading page fragments" here: http://api.jquery.com/load/

$(document).ready(function() {
    $("#table").load("weather_url table:last");
});

You should also know that it is bad for performance if you load a complete page and only use a small part of it. Then it would be better to separate the last table to its own page, and include (preferably server side) that in the original page.

Answer 4

try

$(document).ready(function() {
    $("#table").load("weather_url table:last-child"); // get last
}); 

-- ADDED edited --

if you're having trouble with unstructured html source, you can also try:

  $("#table").load("weather_url table:contains('unique text for filter')"); 

this will get a table that contains 'unique text for filter'.

more of how to use :contains() here.