JQuery: Why is this Load More Functionality not working?
<p>Trying to implement a simple "load more" functionality with jquery. The idea is to use it in the same way as one does pages. Click and a certain number of posts loaded from the database show up.</p>

<p>I have the following javascript:</p>

<pre><code>$(function(){
  var count = 0;
  var num = 20;
  $("#contents").load("posts.php");
  $("#more").click(
 function(){
 var count = 0;
var num = 20;
$("#contents").load("posts.php");
$("#more").click(
        function(){
                $(".loading").show("fast");
                        count += num;
                        $.post("posts.php", {'page': count}, function(data){

                                        $("#contents").append(data);
                                        $(".loading").hide("slow");
                                });

                }

);
</code></pre>

<p>and the following file posts.php</p>

<pre><code>&lt;?
echo "hello";
?&gt;
</code></pre>

<p>And I have another file page.php with </p>

<pre><code> &lt;div id="contents"&gt;&lt;/div&gt;
&lt;div class="loading"&gt;&lt;span style="text-decoration: blink;"&gt;LOADING...!&lt;/span&gt;&lt;/div&gt;
&lt;button id="more"&gt;More..&lt;/button&gt;
</code></pre>

<p>When i click the "More Button" though nothing happens even though I'm just trying to print out a simple hello world here. I have loaded the javascript in the head of the file like</p>

<pre><code>&lt;script type ="text/javascript" src ="javascript/load.js"&gt;&lt;/script&gt;
</code></pre>

<p>Other javascript functionality I've implemented is working fine. Is there something to add to the "loading" or "contents" elements in page.php?</p>
