ajax 加载更多小圆圈,通过返回<div>,使用Ajax/jQuery加载更多内容

我正在开发一个像facebook这样的社交网站,当你拖到页面底部时,会加载新内容.相反,我的页面将有一个更多按钮而不是滚动.每当用户点击"更多"按钮时,新内容将加载到底部.

我的页面由三个不同的列组成.所以,我想要做的是在点击"更多"按钮时为这3列添加3个新的不同内容.

我想使用ajax和php在主列div中返回一个新的div内容.这样的事情如下.

Content Here

Load data from php/mysql database (For 1st Main Div)

Load more from php/mysql database when 'more' button is click

Load data from php/mysql database (For 2nd Main Dev)

Load more from php/mysql database when 'more' button is click

Load data from php/mysql database (For 3rd Main Dev)

Load more from php/mysql database when 'more' button is click

Show More

我应该如何编写我的PHP代码？因为我要返回一个完整的div内容.我的想法如下所示.

$sql_stmt = "SELECT * FROM customers";

$sql = mysqli_query($con, $sql_stmt) or die(mysqli_error($con));

$row = mysqli_fetch_assoc($sql);

$content = '

'.$row['firstname'].'

';

?>

我想将$ content字符串返回到主列1,2和3,因此它将在该列下显示一个新的div.

谢谢!

编辑:我发现这个如何实现jScroll？但不知道作者是如何编写他的PHP代码的.也许这与我的情况几乎相同？