Modify Pagination URL on SHOPIFY using javascript

[alejopixl]

My current pagination format is:

https://poptopia.us/collections/new?page=2
https://poptopia.us/collections/funko-pop?page=2

But I need the URL format to be:
https://poptopia.us/collections/new/2
https://poptopia.us/collections/funko-pop/2

Using Javascript I was able to modify the pagination URL like this:
https://poptopia.us/collections/{{ collection.url }}/2/

...but it doesn't show/put the name of the current collection instead it shows: {{ collection.url }}

How can I displayed the name of the collection there?

Here is the Javascript code i am implementing:

document.addEventListener('DOMContentLoaded', function() {
var paginationLinks = document.querySelectorAll('.pagination a');
var collectionUrl = '{{ collection.url }}';

paginationLinks.forEach(function(link) {
var pageUrl = link.getAttribute('href');
var pageNumber = pageUrl.substring(pageUrl.lastIndexOf('=') + 1);

link.setAttribute('href', collectionUrl + '/' + pageNumber + '/');
});
});