javascript - How to load the div of another webpage and not the entire page into my webpage? -

i have 2 webpages internal.html , external.html

i have following piece of code in internal.html loads external.html div id "result"

   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>    <script> function autorefresh_div() {       $("#result").load("https://abc/external.html");// function load data other file after x seconds  }    setinterval('autorefresh_div()', 5000); // refresh div after 5 secs             </script> 

i have div id "test" in external.html.
how load div id "test" of external.html internal.html's div id "result" , not entire page?

http://api.jquery.com/load/

loading page fragments

the .load() method, unlike $.get(), allows specify portion of remote document inserted. achieved special syntax url parameter. if 1 or more space characters included in string, portion of string following first space assumed jquery selector determines content loaded.

we modify example above use part of document fetched:

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

when method executes, retrieves content of ajax/test.html, jquery parses returned document find element id of container. element, along contents, inserted element id of result, , rest of retrieved document discarded.

jquery uses browser's .innerhtml property parse retrieved document , insert current document. during process, browsers filter elements document such , , or elements. result, elements retrieved .load() may not same if document retrieved directly browser.

---

in case you'll want modify code to:

$("#result").load("https://abc/external.html #test")