Getting Wikipedia infobox content with JQuery

Question

I'm looking to use JQuery to pull back contents of the Wikipedia infobox that contains company details.

I think that I'm almost there but I just can't get the last step of the way

var searchTerm="toyota";
var url="http://en.wikipedia.org/w/api.php?action=parse&format=json&page=" + searchTerm+"&redirects&prop=text&callback=?";
$.getJSON(url,function(data){
  wikiHTML = data.parse.text["*"];
  $wikiDOM = $(wikiHTML);
  $("#result").append($wikiDOM.find('.infobox').html());
});

The first part works - wikiHTML contains the content of the page, parsed by the Wikipedia API to HTML format

This contains the table with the infobox content:

 <table class="infobox vcard" cellspacing="5" style="width:22em;">

result is just an empty table placeholder to put the data in

It works with some other elements from the page - for example, swapping .infobox for .logo works perfectly.

Happy to provide more info, but I've spent hours on this and tried so many permutations that I'm not even sure what's relevant anymore...

TIA

Answer 1

It seems Wikipedia's JSON doesn't return a wrapping document element. This appears to be preventing any attributes on the elements that are at the root from being selectable. Try this:

var searchTerm="toyota";
var url="http://en.wikipedia.org/w/api.php?action=parse&format=json&page=" + searchTerm+"&redirects&prop=text&callback=?";
$.getJSON(url,function(data){
  wikiHTML = data.parse.text["*"];
  $wikiDOM = $("<document>"+wikiHTML+"</document>");
  $("#result").append($wikiDOM.find('.infobox').html());
});

Hope that works!