Как повесить обработчик события на объект лайтбокса, который еще не существует на странице?

MrColdCoffee, нет, не работает. Нужно через делегирование...
Такая реализация используется для ограничения ввода символов, как на основной странице, так и в лайтбоксе. И это работает должным образом.
Но у меня не получается построить правильно на ее основе :(

window.addEventListener('DOMContentLoaded', function () {
    var parentElement = document.body;
    var maxLength = 50;
  
    parentElement.addEventListener('input', function (e) {
      var target = e.target;
  
      if (
        target.matches &&
        target.matches('div[contenteditable].js_app_comment_feed_textarea')
      ) {
        if (target.innerHTML.length > maxLength) {
          var selection = window.getSelection(),
            range = selection.getRangeAt(0),
            pos = range.endOffset;
          target.innerHTML = target.innerHTML.substr(0, maxLength);
          selection.removeAllRanges();
          selection.addRange(range);
        }
      }
    });
  });

Как повесить обработчик события на объект лайтбокса, который еще не существует на странице?

MrColdCoffee, нет, так не работает к сожалению.

document.addEventListener('DOMContentLoaded', function() {
    var cut = document.getElementsByClassName('light_top_hover');
    for( var i = 0; i < cut.length; i++ ){
      cut[i].innerText = cut[i].innerText.slice(0,20) + '...';
    }
});