CODEWITHSUNDEEP
jqueryhtmlajax
Neekoy
Neekoy

Reputation: 2533

Run jQuery function on update of div's HTML

I have the following AJAX call to a file:

$.ajax({
    url: readfile.txt,
    cache: false,
    success: function(data){
        $('#content').html(data);
    };
});

It appends the contents of the readfile.txt to the #content div. This is working properly.

What I want to do, is to scroll to the bottom of the div, every time the content is changed. Currently I have the following:

$('#content').bind('DOMNodeInserted DOMSubtreeModified', function(){
    $('#content').animate({scrollTop: $('#content').prop("scrollHeight")}, 500);
});

The animate function is working properly, however it isn't being triggered when the html of the #content div is changed. Is there a better way to listed for html change events?

Thanks in advance.

Upvotes: 0

Views: 61

Answers (1)

bcr
bcr

Reputation: 3811

Just add the animation to your success callback

$.ajax({
    url: readfile.txt,
    cache: false,
    success: function(data){
        $('#content').html(data).animate({scrollTop: $('#content').prop("scrollHeight")}, 500);
    };
});

Upvotes: 3

Related Questions