Stef Stef - 3 months ago 20
HTML Question

jQuery load() div, then use jQuery on that div

I'm making a site with Wordpress.
I've made a footer which loads in a single entry from my guest book. It does so like this:

$(".footer-gastenboek").load("http://darylkeep.com/gastenboek/ .gwolle_gb_first");


I want to shorten this entry, like this:

$(".footer-gastenboek .gb-entry-content").text(function(index, currentText) {
return currentText.substr(0, 50);
});


But nothing happens. Why though? Thanks in advance!

This is the output html

<div class="footer-gastenboek">
<div class="gb-entry gb-entry_9 gb-entry-count_1 gwolle_gb_uneven gwolle_gb_first admin-entry">
<div class="gb-author-info">
<span class="gb-author-name"><i>darylkeep</i></span>
<span class="gb-datetime">
<span class="gb-date"> schreef op 5 september 2016</span>:
</span>
</div>
<div class="gb-entry-content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est .
</div>
</div>
</div>

Answer

Its because load is async so you must manipulate text in callback function

$(".footer-gastenboek").load("http://darylkeep.com/gastenboek/ .gwolle_gb_first", function() {
    $(".footer-gastenboek .gb-entry-content").text(function(index, currentText) {
        return currentText.substr(0, 50); 
    });
});