How to load plain text into a div from another page

Question

I am trying to load content from another div page into another div.

What I have:

Jquery:

$('#news_date-1').load('test.php .news_date-1');

test.php

<div class="news_date-1">20-11-2009</div>

Destination.html

 <div id="news_date-1"></div>

Result i get =

<div id="news_date-1"><div class="news_date-1">20-11-2009</div></div>

Result i want =

<div id="news_date-1">20-11-2009</div>

Can anybody help?

Answer 1

In the callback you can try unwrap().

$('#news_date-1').load('test.php .news_date-1', function () {
    $(this) //will refer to #news_date-1
        .find('.news_date-1') //find the inserted div inside
        .contents() //find all its contents
        .unwrap(); //unwrap the contents, thus removing the unneeded div
});

This is not the most beautiful solution, because it .load()already inserts it into the DOM, and then you again intervene in the DOM, which should be minimized.

Another way I see is using $.get()instead:

$.get('test.php', function(receivedHtml) {
    //getting only the parts we need
    var neededHtml = $(receivedHtml).find('.news_date-1').html();
    //adding it to DOM
    $('#news_date-1').append(neededHtml);
});

Answer 2

Try the following:

$.get('test.php', function(data) {
    $('#news_date-1').append($(data).find('.news_date-1'));
});