Как сделать обработку события, добавленного элемента на страницу?

Делаю дерево комментариев , есть класс magnific-pop-up (класс jQuery-плагинa magnific-popup), на него навешан слушатель на событие onclick. Так как я делаю дерево комментариев, то добавляю дочерний элемент с таким же классом. Вот тут выходит незадача, на дочернем элементе слушатель срабатывает только при перезагрузке страницы, что мне не надо, нужно, чтобы при добавлении на нем также был слушатель. Как это сделать?
Код слушателя:

$('.popup-with-form').click(function(){
             $('#toForm form').trigger('reset');
            var  dataParentId = $(this).attr('data-parent-id');
            if(typeof dataParentId == 'undefined')
            {
                dataParentId = 0;
            }
            $('#parentId').attr('value',dataParentId); 
            $('.popup-with-form').magnificPopup({
        		type: 'inline',
        		preloader: false,
            });
        });

Код вставки элемента:

function(data,textStatus,jQhr){
                    var  parseData = $.parseJSON(data);
                    var htmlToAppend = '<div class="reviews_row"><div class="reviews_name">'+parseData.record.surname+' '+parseData.record.username+'<span class="reviews_time">';
                    htmlToAppend +=parseData.record.date;
                    htmlToAppend +='</span></div>';
                    htmlToAppend +='<div class="reviews_text">';
                    htmlToAppend +=parseData.record.text;
                    htmlToAppend +='</div>';
                    htmlToAppend +='<a href="#toForm" data-parent-id="'+parseData.record.comments_id+'" class="popup-with-form"> <span class="respond">Ответить</span></a>'; 
                    htmlToAppend +='</div>';
                    $('#toForm .messageText').text('Ваш отзыв  добавлен');
                    var parentId = parseData.record.parentID;
                    if(parentId!=='0')
                    {
                        //  не соблюдается иерархия, перестроить селектор 
                        var $updateTree  = $('#forAddedComments a[data-parent-id="'+parentId+'"]');
                        var $subitemToUpdate =    $($updateTree).parents('.reviews_row').next('.subitem');
                        if(typeof  subitemToUpdate!=='undefined')
                        {
                            console.log('vetka 1');
                            $subitemToUpdate.append(htmlToAppend);
                        }
                        else
                        {
                            console.log('vetka 2');
                            $('<div class="subitem">'+htmlToAppend+'</div>').insertAfter($($updateTree).parents('.reviews_row'));
                        }
                        
                                                    
                    }
                    else
                    {
                        
                        $('#forAddedComments').append(htmlToAppend);
                        var addedSpan = $('#wrapMoreReviews').detach();
                        $('#forAddedComments').append(addedSpan);
                    }
                    window.setTimeout(
                    function(){
                        $.magnificPopup.close();
                       
                    },
                    4000);
                }