Events not working for dynamically created elements?

Question

JavaScript

When a button is clicked, an element should be created and it would seem that everything works, but the events associated with the classes of this element do not work

$('.add-newPost-bth').on('click', function(){
    $(`<div class="newPost">
        <div class="form-new-post">
            <form class="field-form-new-post">
                
            </form>
        </div>
        <script>
            autosize($('.textaria-new-post'));
        </script>
    </div>`).insertAfter('.newPost')
})

PS Content has been scaled down for readability. Methods from the category to add live (), setTimeout, etc. did not help

Answer 1

Use event bubbling.

$(document).on('click', '.add-newPost-bth', function() {
  ...
});

Instead of document, you can substitute the selector of any static parent.