if you have trouble with bootstrap flex hide issue you have to remove the class first then hide it

var items = $(".list-wrapper .part_data");
var numItems = items.length;
var perPage = 5;

//remove class first then hide
items.slice(perPage).removeClass("list-group-item list-group-item-action d-flex align-items-center part_data").hide();

$('#pagination-container').pagination({
items: numItems,
itemsOnPage: perPage,
prevText: "«",
nextText: "»",
onPageClick: function (pageNumber) {
var showFrom = perPage * (pageNumber - 1);
var showTo = showFrom + perPage;

//remove curent showing active class then hide, and the new list add the class again then show
items.removeClass("list-group-item list-group-item-action d-flex align-items-center part_data").hide().slice(showFrom, showTo).addClass("list-group-item list-group-item-action d-flex align-items-center part_data").show();

}
});

Start by reproducing the reported pagination behavior with the provided .list-wrapper .part_data snippet and Bootstrap flex classes, then inspect the pagination callback that hides and shows items. Done means paginated items can be hidden and shown without requiring the listed classes to be removed and re-added.

Written by the indexing model from the issue text.