Why can't I hang event on dropdown-backdrop in Bootstrap?

Question

JavaScript

Hello. There is a dropdown on Bootstrap3. When it is opened, an empty element with the dropdown-backdrop class appears, by clicking on which this dropdown closes. I need that after closing the dropdown, a certain action is also performed, for example $('body').removeClass('noscroll'). But when I hang click $('.dropdown-backdrop').on('click', function () {}), it doesn't work. Please help me solve this problem.

Answer 1

Most likely, when you hang the handler, the element simply does not exist, because the bootstrap only adds it after the dropdown opens. Attach a handler to document:

document.addEventListener('click', (event) => {
  if (event.target.classList.contains('dropdown-backdrop') {
    // нужный код
  }
})