Как заставить jq обрабатывать новый созданный html?

Суть в чем. Скрипт при клике по mleft получает от сервера ответ и создает второе меню. Функция getTable работает со вторым полученным меню но срабатывает она 1 раз почему-то. Т.е при первом создании меню - все работает, класс присваивается, когда это меню создается второй раз - ничего не работает. Как быть?

$(document).ready(function(){
    $('.mleft').on('click',function(){
        $('.mleft').removeClass('action');
        $(this).addClass('action');
        let left = $(this).data('left');
        $.ajax({
            type: 'POST',
            url: '/view-main',
            data: {
                left: left
            },
            success:function(items){
                $('.button-main').hide('slow',function(){
                    $('.main-menu > nav > ul').empty();
                    items.main.forEach(function(body){
                        $('.main-menu > nav > ul').append('<li class="mmain" data-main="' + body.id + '">' + body.name + '</li>');
                    });
                });
                $('.button-main').slideToggle('slow');
                getTable();
            },
            error:function(err){
                console.log(err);
            }
        });
    });
    function getTable(){
        $('.mmain').on('click',function(){
            $('.mmain').removeClass('action-m');
            $(this).addClass('action-m');
        });
    }
});

Ответы (1 шт):

Автор решения: Igor
$(document).on('click', '.mleft', function(){

и вместо getTable

$('.main-menu').on('click', '.mmain', function(){
  ...
});
→ Ссылка