Ajax-Success won't recognize empty data

Question

I assume the title is not so clear. The following explanation will be much better.

My page includes an Ajax-driven Feed getting data from a PHP script. If everything is loaded a button would change as defined in conditions for "Success". It works well. Now I have changed data for the PHP-file and it won't change. But I don't recognize why or where the problem is.

Because the problems seems to appear in the output prior to the ajax-call I will insert only the part where I create the array-rows from the MySQL as prior code is usually the same:

if(isset($_POST["limit"], $_POST["pid"],$_POST["start"]))
{

 $query = "SELECT - QUERY";
 $result = mysqli_query($con, $query);
while($row = mysqli_fetch_array($result))
 {
  $text = preg_replace('/(?<!\S)#([0-9a-zA-Z]+)/', '<a style="color:orange; text-decoration: none; font-weight: bold;" href="brand?p=$1">#$1</a>', $row["post"]);
  if(!empty($row["vact"])) {
    $vote_rank = $row["vact"];

    if($vote_rank == 1) {
    $up = "enabled";
    $down = "disabled";
    $colup = "orange";
    $coldw = "grey";

    }
    elseif($vote_rank == 2) {
    $up = "disabled";
    $down = "enabled";
    $colup = "grey";
    $coldw = "orange";  

    }
  }
  else {
    $up = "enabled";
    $down = "enabled";
    $colup = "orange";
    $coldw = "orange";      
  } 

  if(empty($row["vote"])) {
    $votres = 0;
  }
  else {
    $votres = $row["vote"];
  }



  echo '
  <div class="" id="reply-'.$row["id"].'">

  <img src='.$row["img"].' class="img-fluid" style="max-width:450px; width:100%;">
  <div class="container" style="max-width:600px;">
        <p class="w3-xlarge w3-padding lead" >"'.$text.'"</p>
        <div class="w3-row">
        <div class="w3-left vtbtn">
            <button style="color:'.$colup.';" '.$up.' onClick="addVote('.$row["id"].',2)"><i class="material-icons">sentiment_very_satisfied</i></button> 

            <a id="votes-'.$row["id"].'">'.$votres.' </a>
            <input type="hidden" id="vts-'.$row["id"].'" value="'.$votres.'"> 

            <button style="color:'.$coldw.';" '.$down.' onClick="addVote('.$row["id"].',1)"><i class="material-icons">sentiment_dissatisfied</i></button> 
            <a href="post_coll_add.php?pid='.$_POST["pid"].'&id='.$row["id"].'" style="color:orange;"><i class="material-icons">add</i></a>
        </div>
        <div class="text-muted w3-right" style="width:45%; text-align: right; margin-bottom: 50px;">By <a href="profile?usid='.$row["usid"].'">'.$row["fn"].'</a>

        <img class="w3-circle" style="width:20%;" src="'.$row["uav"].'"></div>
        </div>
  </div>
  </div>
   ';
 }
}

In my other file, I receive the output (the echo) and it would be appended to the prior output. So far does it work?

$(document).ready(function(){

 var pid = '<? echo $pid; ?>';
 var limit = 7;
 var start = 0;
 var action = 'inactive';
 function load_country_data(limit, start)
 {
  $.ajax({
   url:"feed_xp_fetching.php",
   method:"POST",
   data:{limit:limit, start:start, pid:pid},
   cache:false,
   success:function(data)
   {
    $('#load_data').append(data);

    if(data == '')
    {
     $('#load_data_message').html("<button type='button' class='btn btn-info'>No Data Found</button>");
     action = 'active';
    }
    else
    {
     $('#load_data_message').html("<button type='button' class='btn btn-warning'>Please Wait....</button>");
     action = "inactive";
    }
   }
  });
 }

 if(action == 'inactive')
 {
  action = 'active';
  load_country_data(limit, start);
 }
 $(window).scroll(function(){
  if($(window).scrollTop() + $(window).height() > $("#load_data").height() && action == 'inactive')
  {
   action = 'active';
   start = start + limit;
   setTimeout(function(){
    load_country_data(limit, start);
   }, 1000);
  }
 });


});

So if every eligible element appeared the button should turn from <button type='button' class='btn btn-warning'>Please Wait....</button> to <button type='button' class='btn btn-info'>No Data Found</button>. But it doesn't.

As I have tried some topics which are unlikely to removing the footer I assume the problem is what happened in the PHP-file before.

But where is the problem that I don't see?

Additional info:

This is the code where it worked (not using the function AddVote) from while:

 while($row = mysqli_fetch_array($result)) {

  $text = preg_replace('/(?<!\S)#([0-9a-zA-Z]+)/', '<a style="color:orange; text-decoration: none; font-weight: bold;" href="brand?p=$1">#$1</a>', $row["post"]);   



  echo '
  <div class="">

  <img src='.$row["img"].' class="img-fluid" style="max-width:450px; width:100%;">
  <div class="container" style="max-width:600px;">
        <p class="w3-xlarge w3-padding lead" >"'.$text.'"</p>
        <div class="w3-row">
        <div class="w3-left">
            <a href="post_vote.php?pid='.$_POST["pid"].'&id='.$row["id"].'&vid=1" style="color:orange;"><i class="material-icons">sentiment_very_satisfied</i></a> '.$row["vote"].' </a> 
            <a href="post_vote.php?pid='.$_POST["pid"].'&id='.$row["id"].'&vid=0" style="color:orange;"><i class="material-icons">sentiment_dissatisfied</i></a> 
            <a href="post_coll_add.php?pid='.$_POST["pid"].'&id='.$row["id"].'" style="color:orange;"><i class="material-icons">add</i></a>
        </div>
        <div class="text-muted w3-right" style="width:45%; text-align: right; margin-bottom: 50px;">By <a href="profile?usid='.$row["usid"].'">'.$row["fn"].'</a>

        <img class="w3-circle" style="width:20%;" src="'.$row["uav"].'"></div>
        </div>
  </div>
  </div>
   ';
 }