如何在div中实现“read more”

I'm showing a part of a retrieved data from the database (authors and dates). But i wish to implement a kind of "read more", in which the author is hyperlinked to the full results i.e. When I click on Author & date, comments gets appended to it. I'll appreciate an example. Thanks

    <body>
    <?php
    session_start();
    $u = $_SESSION['username'];
    if(isset ($_SESSION['username']))
      {
        $database = "xxxx";
        $Username = "username";
        $Password = "password";

        $con="host=localhost port=5432 dbname=$database user=$Username password=$Password";
        $db=pg_connect($con) or die('connection failed');
        $query = 'select a.name,p.date,p.comment from author a, post p where a.name = p.author';
        $posts = pg_query($db, $query);                   
      }
    ?>

    <div class = "result">
    <h2>Show Result</h2>
    <?php
     while($row=pg_fetch_assoc($posts))
     {
       $author=$row['a.name'];
       $date=$row['p.date'];
       echo "<p><a href='#'>$author:$date</a></p>";
     }
     ?>
    </div>
    </body>

Add the comment in the HTML :

   $author=$row['a.name'];
   $date=$row['p.date'];
   $comment=$row['p.comment'];
   echo "<p><a href='#'>$author:$date</a><span class=\"comment\">$comment</span></p>";

And add this code JS :

$(function(){
    $(".result p > span.comment").hide(0);
    $(".result p > a").click(function(e){
        var comment = $(this).parent().find("span.comment");
        if (comment.is(":visible"))
            comment.slideUp();
        else
            comment.slideDown();
        return false;
    });
});

(You have added the tag jQuery, so I think you use it)