CODEWITHSUNDEEP
ajaxhtmljquery
user189210
user189210

Reputation:

loading div content from external with jQuery.load into own div

Let's say that I have two html pages that are identically designed, but have different content. I have the same div with the same id on both pages. How do I use jQuery.load (or what do I use) so that the div#conent does not get added into the div#content of the first page.

I've tried this:

$(document).ready(function(){
  $("a#linkHome").click(function(){$("div#content").load('index.htm #content');});
  $("a#linkPage2").click(function(){$("div#content").load('page2.htm #content');});
});

... but it ends up adding another div to the already existing div!

<div id="content">
  <div id="content">
    Blah Blah Blah
  <div id="content">
</div>

Upvotes: 1

Views: 9672

Answers (2)

Roberto Aloi
Roberto Aloi

Reputation: 30985

Or you can try the opposite approach. Just add a wrapper div into your target page.

Upvotes: 0

mck89
mck89

Reputation: 19231

Try with:

$(document).ready(function(){
  $("a#linkHome").click(function(){$("div#content").load('index.htm #content *');});
  $("a#linkPage2").click(function(){$("div#content").load('page2.htm #content *');});
});

in this way you get all elements inside the div#content but not the div itself.

Upvotes: 5

Related Questions