jQuery not working after $ajax call

Question

I'm trying to get data from a php file with jQuery $.post method. After the ajax call i'm appending a button from php file which will onclick load more posts by removing itself, but after ajax call the jQuery is no longer working.

var result = function (str,end)
{
    $.get("query.php",{ start:str, end: end },function(ajaxresult){
    $(ajaxresult).appendTo(".focus");  
    })
}
result(4,0);

$('#loadmore').on('click', function(e){
    result(8,4);
    alert('delete');
    e.preventDefault();
    e.remove();
});

Here is my Php file code.

<?php
$start = $_GET['start'];
$end = $_GET['end'];


$con = mysqli_connect('localhost','root','binarystar','test');
if (!$con)
{
    die('Could not connect: ' . mysqli_error($con));
}

mysqli_select_db($con,"users");
$sql="SELECT * FROM post ORDER BY id DESC LIMIT $end,$start";

$result = mysqli_query($con,$sql);


while($row = mysqli_fetch_array($result))
{
    echo "<section>";
    echo "<span class='feed_username'>" . $row['username'] ."</span>   ";
    echo "<span class='date'>" . $row['time'] ."</span><br>";
    echo "<span class='postx'>" . $row['post'] ."</span><br>";
    echo "</section>";

}
echo "<button id='loadmore'>Load More Posts</button>";

mysqli_close($con);

This isn't pertinent to your question, but consider using PDO for security and performance in doing your MySQL queries. us2.php.net/pdo_mysql — dclowd9901
– dclowd9901, Commented Mar 30, 2014 at 16:53

Felix · Accepted Answer · 2014-03-30 16:50:29Z

1

Since id is unique, you need to use class instead:

echo "<button class='loadmore'>Load More Posts</button>";

Then you can use event delegation for dynamically loaded elements:

$('body').on('click', '.loadmore', function() {
    // Your code here
});

answered Mar 30, 2014 at 16:50

Felix

38.2k8 gold badges46 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

adeneo Over a year ago

How do you know the button isn't already inside .focus, and is overwritten by the new content, that way the ID would be unique in the document ?

Collectives™ on Stack Overflow

jQuery not working after $ajax call

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related