using above plugin i have generated the dynamic list of ul using below js code.

1. function FetchData() {
   $.ajax({
   ......
   success: function (r) {
   
   
    $.each(JSON.parse(data), function (key, result) {
   // appending data in ul. 
   }
   
   });
               SetPaginate();
   
           }
       });}
   
   function SetPaginate() {
   
       $('#locationdata').paginate({
           perPage: 20,
           autoScroll: true,
           //paginatePosition: ['bottom'],
           useHashLocation: true
       });
   
   }

Below is my Page Design.

1. <div class="DivwithScroll" id="divresultdata">
   
   <ul id='example'>
   </ul>

2. //Currently data pager is appering here 

3.  </div>
       <div id="datapager"> // Want to add it pager here instead of after example ul </div>
   
   /// Css
    <style>
           .DivwithScroll {
               border: 2px solid black;
               background-position: center;
               background-size: cover;
               background-repeat: no-repeat;
               margin: 0 -2px -2px 0;
               height: 360px;
               overflow-y: auto;
           }
   <style>

I am looking data pager separate out from plugin.  So all the 20 records will set inside div id divresultdata with scroll and pager will set in the div  id with datapager.

Thanks in Advance,
Omkar.