I seem to be facing an issue with selecting DOM elements that are part of bootstrap-slider. When I try to target them with events like click, nothing happens.
All events work fine when the page is refreshed. What could be causing this problem?
$(document).on("page:change", function() {
$(".slider-handle")
.on("mousedown", function() {
console.log("FOCUSED")
$(".active-handle").removeClass("active-handle");
$(this).addClass("active-handle");
})
.on("mouseup", function() {
console.log("REMOVED")
$(this).removeClass("active-handle");
$(".active-handle").removeClass("active-handle");
})
.on("click", function() {
console.log("REMOVED")
$(this).removeClass("active-handle");
$(".active-handle").removeClass("active-handle");
})