Given Script load data from specific div of external source on click. It load all data form a div of external source. But now trying to load only specific things I want. Like load only image, then title, post Label, date and comments only, not text summery, in same order.
Script:
$(function() {
var page = null;
var counter = 0;
function getNext() {
// Grab the next element from the array of date-outer divs and copy it to the .content div
if (counter >= page.length)
return;
var elm = $(page[counter]).clone();
elm.find('script').remove(); // Remove script tags in the div
elm.appendTo('#load-here');
counter++;
}
$('button.btn').click(function(e) {
if (page === null) {
page = false; // Prevents the request from being made twice
$.get('http://test-html-site.blogspot.com/search/label/', function(data) {
page = $(data).find('.date-outer');
getNext();
});
} else if (page !== false) {
getNext();
}
});
});
HTML:
<button class='btn'/>
<div id="load-here"></div> <!-- Load Here -->
</body>
HTML Structure of external site:
Given script load .date-outer per click.
<body>
<div class="blog-posts hfeed">
<div class="date-outer">
Contecnt 1: Title, img, comments, text </div>
<div class="date-outer">
Contecnt 2: Title, img, comments, text </div>
<div class="date-outer">
Contecnt 3: Title, img, comments, text </div>
</div>
</body>
Example External site link
Single Content structure.
My question is how to load only specific data, like image, then title, Post Labels, date and comments only, not text summery, in same order.
