Pagination - JQUERY - php

Question

Imagine that I have 1 2 3 4pages in my table, then if I click the page 1 the number 1 will be background: black Then the problem is the whole pages will be black, when I executing. Please help me out of this problem. I want to change the background color of the page if what page I click. Tyia
Here's the code:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<div class="table-responsive" id="pagination_data"></div>
<script>
$(document).ready(function(){
load_data();
function load_data(page)
{
$.ajax({
url:"pagination.php",
method:"POST",
data:{page:page},
success:function(data){
$('#pagination_data').html(data);
$(".pagination_link").css({"background":, "black"});
}
})
}
$(document).on('click', '.pagination_link', function(){
var page = $(this).attr("id");
load_data(page);
$(".pagination_link").css({"background":, "black"});
});
});
</script>
PHP code:
<?php
//pagination.php
$connect = mysqli_connect("localhost", "root", "", "psbr");
$record_per_page = 6;
$page = '';
$output = '';
if(isset($_POST["page"]))
{
$page = $_POST["page"];
}
else
{
$page = 1;
}
$start_from = ($page - 1)*$record_per_page;
$query = "SELECT * FROM accounts ORDER BY id DESC LIMIT $start_from, $record_per_page";
$result = mysqli_query($connect, $query);
$output .= "
<div class='grid-container'>
";
while($row = mysqli_fetch_array($result))
{
$output .= '
<div class="grid-content">
<img src="../accounts/table/upload/'.$row['image'].'" class="grid-image">
</div>
';
}
$output .= '</div> <br /><div align="right">';
$page_query = "SELECT * FROM accounts ORDER BY id DESC";
$page_result = mysqli_query($connect, $page_query);
$total_records = mysqli_num_rows($page_result);
$total_pages = ceil($total_records/$record_per_page);
for($i=1; $i<=$total_pages; $i++)
{
$output .= "<span class='pagination_link' id='".$i."'>".$i."</span>";
}
$output .= '</div><br /><br />';
echo $output;
?>