通过AJAX重新加载div内容后，更新的html消失了

Question

I have JS code which reloads my div every 2 seconds:

var auto_refresh = setInterval(function() {
    $('#indexRefresh').load('/includes/index_refresh_include.php?_=' + Math.random());
}, 2000);

Then I make an AJAX request which loads more content when a 'load more' button is pressed, but since it's reloading the loaded content disappears.

$(function() {
    $(document).on("click", ".loadmore", function() {
        var ID = $(this).attr("id");
        var split = ID.split("-");
        if (ID) {
            $("#more" + ID).html('<img src="moreajax.gif" />');
            $.ajax({
                type: "POST",
                url: "loadmore.php",
                data: "rowstart=" + ID,
                cache: false,
                success: function(html){
                    $("#updates").append(html);
                    $("#more" + ID).remove();
                }
            });
        }
        else {
            $(".morebox").html('The End');
        }
        return false;
    });
});

What should I do so the loaded content won't disappear?

EDIT:

this is the html

echo"<div id='indexRefresh'>";
        include INC.'index_include.php';
echo"</div>";

this is the index_refresh_include.php file

$result1 = dbquery("SELECT DISTINCT model_id, model_username FROM models LEFT JOIN `show` ON models.model_id=show.show_model_id ORDER BY show_ended=0 DESC, model_id ASC LIMIT 6");

$rowstart = 0;
echo"<section class='list'>";
echo"    <div id='updates'>";
echo"        <div class='small_block'>";
while($data = dbarray($result1)){
    $modelID = $data['model_id'];
    $result = dbquery("SELECT * FROM `show` WHERE show_model_id='$modelID'");
    if(dbrows($result) >= 5){
        echo"    <article>";
    } else {
        echo"    <article class='new'>";
    }
    echo"           <a class='checkcam' href='checkcam.php?model=".$data['model_username']."'>";
    echo"               <img src='".getAvatar($data['model_id'])."' alt='' />";
    echo"           </a>";
    echo"       </article>";
    $rowstart++;
}
echo"        </div>";

$blockstart = 0;
$large = dbquery("SELECT * FROM largeblocks WHERE large_status=1 ORDER BY large_pos ASC LIMIT 1 OFFSET $blockstart");
if(dbrows($large) != 0){
    while($block = dbarray($large)){
        echo"        <div class='large_block'>";
        echo"            <article>";
        echo"                <a href='Cam.php?show=1'>";
        echo"                    <img src='http://placehold.it/600x600' alt='' />";
        echo"                </a>";
        echo"            </article>";
        echo"        </div>";
        $blockstart++;
    }
} else {
    $model = dbquery("SELECT * FROM models ORDER BY model_credits DESC LIMIT 1 OFFSET $blockstart");
    while($block = dbarray($model)){
        echo"        <div class='large_block'>";
        echo"            <article>";
        echo"               <a class='checkcam' href='checkcam.php?model=".$block['model_username']."'>";
        echo"                   <img src='".getAvatar($block['model_id'], '600x600')."' alt='' />";
        echo"                </a>";
        echo"            </article>";
        echo"        </div>";
        $blockstart++;
    }
}

echo"        <br class='clear' />";

$large = dbquery("SELECT * FROM largeblocks WHERE large_status=1 ORDER BY large_pos ASC LIMIT 1 OFFSET $blockstart");
if(dbrows($large) != 0){
    while($block = dbarray($large)){
        echo"        <div class='large_block'>";
        echo"            <article>";
        echo"                <a href='Cam.php?show=1'>";
        echo"                    <img src='http://placehold.it/600x600' alt='' />";
        echo"                </a>";
        echo"            </article>";
        echo"        </div>";
        $blockstart++;
    }
} else {
    $model = dbquery("SELECT * FROM models ORDER BY model_credits DESC LIMIT 1 OFFSET $blockstart");
    while($block = dbarray($model)){
        echo"        <div class='large_block'>";
        echo"            <article>";
        echo"               <a class='checkcam' href='checkcam.php?model=".$block['model_username']."'>";
        echo"                   <img src='".getAvatar($block['model_id'], '600x600')."' alt='' />";
        echo"                </a>";
        echo"            </article>";
        echo"        </div>";
        $blockstart++;
    }
}

$result1 = dbquery("SELECT DISTINCT model_id, model_username FROM models LEFT JOIN `show` ON models.model_id=show.show_model_id ORDER BY show_ended=0 DESC, model_id ASC LIMIT 6 OFFSET $rowstart");

echo"        <div class='small_block'>";
while($data = dbarray($result1)){
    $modelID = $data['model_id'];
    $result = dbquery("SELECT * FROM `show` WHERE show_model_id='$modelID'");
    if(dbrows($result) >= 5){
        echo"    <article>";
    } else {
        echo"    <article class='new'>";
    }
    echo"               <a class='checkcam' href='checkcam.php?model=".$data['model_username']."'>";
    echo"                   <img src='".getAvatar($data['model_id'])."' alt='' />";
    echo"               </a>";
    echo"           </article>";
    $rowstart++;
}


echo"        </div>";

echo"        <br class='clear' />";

echo"    </div>";

echo"    <div id='more$rowstart-$blockstart' class='morebox'>";
echo"        <a href='#' class='loadmore gardient' id='$rowstart-$blockstart'>".$lang['index_loadmore']."</a>";
echo"    </div>";

echo"</section>";

Answer 1

This is the correct code

var auto_refresh = setInterval(function() {
    $('<div></div>').appendTo('#indexRefresh').load('/includes/index_refresh_include.php?_=' +Math.random());
}, 2000);

This appends each time a < div > on div with id=indexRefresh. And then loads inside the new div the URL

See fiddle