Question

I’m creating a basic forum where every message contains the authors name, some text and the date it was created. I’d like the forum to update constantly through AJAX, and show new posts that were created on the fly.
I currently have a PHP file getlatest.php?lastid=... that retrieves all posts from the ID given to the most current.
It returns the data in HTML, like so (i’ve altered it so you can see the divs, stackoverflow throws them out):

foreach ($print as $value)
{
    $readyText .= div id = $value->post_id;
    $readyText .= $value->first_name.' '.$value->last_name.' posted the following:'.
    $value->post_text.' The post was made about '.$time.' ago. 
    $readyText .= '/div>'; 
}

I have some AJAX code in jquery that retrieves every few moments

setInterval("update()", 3000);
            function update()
            {
                $.get("getlatest.php", 
                {
                    id: latestmessage
                }, 
                function(response){
                    $("#forum_entries").prepend(response);
                    latestmessage = $.cookie('last_post_id'); //This is
                                      //how I know what the latest post id is
                }, "html");

I wanted to highlight all the new posts that were submitted using the (now very popular) yellow fade technique, like so

$("#somediv").effect("highlight", {}, 1500);

My question is - to what div to I apply this effect?
I should add that back in PHP, every forum post had a div id that was actually its PK in the database.

Answer 1

Change your function so that instead of using prepend, it uses prependTo. PrependTo will return the elements that were prepended and you can apply the highlight to those elements (using jQuery 1.3.2).

  $.get('getlatest.php',
        { id: latestmessage }, 
        function(response) {
            $(response).prependTo('#forum_entries').effect('highlight',{},1500);
            latestmessage = $.cookie('last_post_id');
        }, 'html' );