Javascript load content problem using php

I wish to display products in my table like twitter more tweets load style but here user in my site should click on button to see more products, here I am facing problem when I click on button products loading for first time after next click button not working so I am not getting products, so please help me how to solve this issue

javascript Code is below

$('.more').click(function(){
  var ID = $(this).attr("id");
  var cats = $('input[name=cats]').val();
  $("#more"+ID).html('<img src="<?=ROOT;?>resources/moreajax.gif" />');
  $.post('<?=ROOT;?>product/dataLoad', {id:ID,cats:cats}, function(data){
    if(data) {
      $('ol#updates').append(data);
      $("#more"+ID).remove();
    }
    else{
      $(".morebox").html('The End');// no results
    }
  });
  return false;
});

Select allOpen in new window

My Controller Function Code

public function dataLoad(){
        if(isset($_POST['id']))
    {
    $lastmsg=$_POST['id'];
    $str = $_POST['cats'];
    $query=mysql_query("select * from product where id > '".$lastmsg."' AND category_id IN ($str) order by id asc limit 2");
    $numrows = mysql_num_rows($query);
    while($ob = mysql_fetch_array($query))
    {
                $id = $ob['id'];
    ?>
    <a rel="canonical" href="<?=ROOT?><?=$this->user->sluggify($this->user->getCategoryName($ob['category_id']))?>/<?=$ob['url'];?>.html">
    <div class="product cprod" data-id="<?=$ob['id'];?>">
    <strong><h5 class="cube"><?=$ob['name'];?></h5></strong>
    <?php $img = $this->user->getUploadAction($ob['id']); ?>
    <img src="<?=ROOT.'uploads/'.$img?>" data-img="<?=$img?>">
    <p>
    Rs <span><?php
    $price = $this->user->getLowestPrice($ob['id']);
    echo isset($price)?$price:0;
    ?></span>
    </p>
    </div>
    </a>
    <?php
    }//while
    ?>
    
            <div id="more<?php echo $id; ?>" class="morebox" style="clear:both">
    <input type="hidden" name="cats" value="<?=$str;?>" />
    <a href="#" class="more" id="<?=$id;?>">Load More</a>
    </div>
        <?php
                
            }
        }

Select allOpen in new window

View Page Code

<ol id="updates">
      <?php
      $str = implode(",",$cats);
      $query = "select * FROM product WHERE category_id IN (".$str.") order by id asc limit 2";
      $result=mysql_query($query);
      $numrows = mysql_num_rows($result);
      while($ob = mysql_fetch_array($result))
      {
            $id = $ob['id']
      ?>
      <a rel="canonical" href="<?=ROOT?><?=$this->user->sluggify($this->user->getCategoryName($ob['category_id']))?>/<?=$ob['url'];?>.html">
      <div class="product cprod" data-id="<?=$ob['id'];?>">
      <strong><h5 class="cube"><?=$ob['name'];?></h5></strong>
      <?php $img = $this->user->getUploadAction($ob['id']); ?>
      <img src="<?=ROOT.'uploads/'.$img?>" data-img="<?=$img?>">
      <p>
            Rs <span><?php
            $price = $this->user->getLowestPrice($ob['id']);
            echo isset($price)?$price:0;
            ?></span>
            </p>
            </div>
      </a>
      <?php
      }
      ?>
      </ol>
            <div id="more<?php echo $id; ?>" class="morebox" style="clear:both">
      <input type="hidden" name="cats" value="<?=$str;?>" />
      <a href="#" class="more" id="<?php echo $id; ?>">Load More</a>
      </div>

Select allOpen in new window