Question

I wrote a script and I want to change the language. I managed to do this using the .ajax() function in jQuery and fetching the new HTML.
Afterwards I want to replace the old HTML with the new HTML.

However, I do not want to exchange the whole HTML, but only part of it.
I know that the HTML returned includes a <div id="myDivId">...</div>, so I only want to get the content of that div from the HTML returned, and replace the content of my current div with the new content.
But, I can’t seem to figure out how to fetch only that content from my new HTML. How can I do that? I tried using find, but no success.

$.ajax({
    type: "GET",
    url: "ajax.php",
    data: "action=languagepack&subAction=box&newIso="+newIso+"&country="+country,
    success: function(htmlCode){
        var box = $(htmlCode).find('#myDivId').html();

        alert(box);
    }
});

Best regards,
Paul Peelen

Answer 1

Try jQuery.load()

This method is the simplest way to
fetch data from the server. It is
roughly equivalent to $.get(url, data,
success) except that it is a method
rather than global function and it has
an implicit callback function. When a
successful response is detected (i.e.
when textStatus is “success” or
“notmodified”), .load() sets the HTML
contents of the matched element to the
returned data. This means that most
uses of the method can be quite
simple:

$('#result').load('ajax/test.html');

Loading Page Fragments

The .load() method, unlike $.get(), allows us to specify a
portion of the remote document to be
inserted. This is achieved with a
special syntax for the url parameter.
If one or more space characters are
included in the string, the portion of
the string following the first space
is assumed to be a jQuery selector
that determines the content to be
loaded.

We could modify the example above to use only part of the document that
is fetched:

$('#result').load('ajax/test.html #container');