<?php
add_action('facetwp_scripts', function () {
?>
<script>
FWP.hooks.addAction('facetwp/loaded', function() {
/** 1. add an aria-label attribute to input */
fUtil('.facetwp-per-page-select').each(function() {
fUtil(this).attr('aria-label', 'Set the number of results per page');
});
/** 2. prepend a <label for="id"> element to the <select> element and add an 'id' to the <select> */
let select = document.querySelector('.facetwp-per-page-select');
// set 'id' attribute for select
select.setAttribute('id', 'set-results-per-page');
// create label element
let label = document.createElement('label');
// set 'for' attribute for label: must me same as 'id' of the select element.
label.setAttribute('for', 'set-results-per-page');
// insert label before select in the DOM tree
select.parentNode.insertBefore(label, select);
// add label text
label.textContent = "Set the number of results per page";
}, 1000);
</script>
<?php
}, 100);