Отображение правого бокового меню с помощью ajax

Есть ajax код. По нажатию на пункте меню Ноутбуки и компьютеры -> Моноблоки должно отображаться правое боковое меню ($('.rightmenu').html(data.msg);), но в действительности ничего не происходит.

                    success: function (data) {
                    console.log('check');
                    console.log(data);
                    $('.rightmenu').html(data.msg);
                    $('.centerarea').html('<div id=\"topcenterarea\">'+'<h1>'+data.header+'</h1>'+data.countrecords+'товара'+'</div>'); 

                    // expandCollapsedFunction();
            }

Сравни https://i.stack.imgur.com/oOBjn.png и https://i.stack.imgur.com/xTYjK.png. Далее приведен javascript код со страницы testsite.html, содержащий ajax запрос.

<script>
    $(document).ready(function() {
        console.log('check');
        let subcategoryflag='';
        console.log(subcategoryflag);
            $('.submenu__item a').on('click', function (event) {
                event.preventDefault();
                console.log('Inner check');             
                subcategoryflag=event.target.innerHTML;
                $.ajax ({
                    method: 'POST',
                    url: 'ajaxsubcategory1.php',
                    cache: false,
                    data: {subcategoryflag: subcategoryflag},
                    dataType: 'json',
                    complete: function(data) {
                        console.log(data.header);
                        console.log(data.countrecords);
                    },
                    success: function (data) {
                        console.log('check');
                        console.log(data);
                        $('.rightmenu').html(data.msg);
                        $('.centerarea').html('<div id=\"topcenterarea\">' +'<h1>'+data.header+'</h1>'+data.countrecords+'товара'+'</div>'); 

                        /*expandCollapsedFunction();*/
                        
                }
            

            }
            );
        }
        );      
        
        let categoryflag='';
            $('.submenu__title a').on('click', function (event) {
                event.preventDefault();
                console.log('Inner check');             
                categoryflag=event.target.innerHTML;
                subcategoryflag=categoryflag;
                console.log(categoryflag);
                $.ajax ({
                    method: 'POST',
                    url: 'ajaxsubcategory1.php',
                    cache: false,                   
                    data: {categoryflag: categoryflag, subcategoryflag: subcategoryflag},
                    dataType: 'json',
                    complete: function(data) {
                        console.log(data.header);
                        console.log(data.countrecords);
                    },
                    success: function (data) {
                        console.log('check');
                        console.log(data);
                        $('.rightmenu').html(data.msg);
                        $('.centerarea').html('<div id=\"topcenterarea\">'+'<h1>'+data.header+'</h1>'+data.countrecords+'товара'+'</div>'); 

                        /*expandCollapsedFunction();*/
                }
            }
            );
        }
        );
    }
    )
</script>

В результате значения переменных data.header и data.countrecords - undefined (отладочные переменные)

несмотря на код, приведенный ниже (ajaxsubcategory1.php) ($return['header']='Моноблоки'; $return['countrecords']=0;)

    <?php
class ajaxValidate {

    function formValidate() {
        //Put form elements into post variables (this is where you would sanitize your data)
        $categoryflag=$_POST['categoryflag'];
        $subcategoryflag = $_POST['subcategoryflag'];

        //Establish values that will be returned via ajax
        $return = array();
        $return['msg'] = '';
        $return['error'] = false;
        $return['querycontent']='';
        $return['header']='Моноблоки';
        $return['countrecords']=0;
        
        require_once('config.php');
        $pdo = new PDO($dsn, $user, $password);

        //Begin form validation functionality
        if (!isset($subcategoryflag) || empty($subcategoryflag)){
            $return['error'] = true;
            $return['msg'] .= '<li>Error: Field1 is empty.</li>';
        }
        
        //Begin form success functionality
        if ((!$return['error']) && $subcategoryflag=='Моноблоки'){
            $return['msg'] = '          <div><div class="FilterContainer"><div class="FilterSeoGroup FilterSeoGroup__seo" id="popularCollections"><h4 class="FilterSeoGroup__header">Популярные подборки</h4><div class="FilterSeoGroup__group_closed"><div class="FilterSeoGroup__item-wrapper"><a class="FilterSeoGroup__item" href="https://www.citilink.ru/catalog/monobloki--nedorogie-monobloki/">Недорогие</a></div><div class="FilterSeoGroup__item-wrapper"><a class="FilterSeoGroup__item" href="https://www.citilink.ru/catalog/monobloki--dlya-doma-m/">Для дома</a></div><div class="FilterSeoGroup__item-wrapper"><a class="FilterSeoGroup__item" href="https://www.citilink.ru/catalog/monobloki--dlya-ofisa-m/">Для офиса</a></div><div class="FilterSeoGroup__item-wrapper"><a class="FilterSeoGroup__item" href="https://www.citilink.ru/catalog/monobloki--win/">с Windows</a></div><div class="FilterSeoGroup__item-wrapper"><a class="FilterSeoGroup__item" href="https://www.citilink.ru/catalog/monobloki--imac/">Apple iMac</a></div></div><div class="FilterSeoGroup__toggle-container"><button class="FilterSeoGroup__toggle-button buttonStyleDecorator buttonStyleDecorator_theme_ghostOrange buttonStyleDecorator_size_s Button" name="" type="submit" value="" tabindex="0" borderstyle="none"><span class="buttonStyleDecorator__text ">Показать все</span></button></div></div></div></div>'
            $sql='SELECT * FROM monoblocks';
            $query=$pdo->prepare($sql);
            $result=$query->execute();
            while ($example=$result->fetch(PDO::FETCH_ASSOC))
            {
                $return['querycontent']='<div style="width: 100%; border: 2px solid red"></div>';
            };                  
            /*$return['countrecords']='SELECT COUNT(*) FROM monoblocks';*/
        }

        //Return json encoded results
        return json_encode($return);
    }

}

$ajaxValidate = new ajaxValidate;
echo $ajaxValidate->formValidate();
?>

На клиентской стороне, когда производится щелчок мыши на пункте левого бокового меню (смотри выше на javascript код с testsite.html)

    $('.submenu__title a').on('click', function (event) {}

должно отображаться правое боковое меню

                    success: function (data) {
                    console.log('check');
                    console.log(data);
                    $('.rightmenu').html(data.msg);
                    $('.centerarea').html('<div id=\"topcenterarea\">'+'<h1>'+data.header+'</h1>'+data.countrecords+'товара'+'</div>'); 

                    // expandCollapsedFunction();
            }

но оно не появляется. Должно отображаться как на

а на деле отображается как на скриншоте выше. На серверной стороне написан код по щелчку на пункте меню Моноблоки

    if ((!$return['error']) && $subcategoryflag=='Моноблоки'){...}

А в скобках, возвращаемому значению присваивается строка - html разметка правого бокового меню

                $return['msg'] = '          <div><div class="FilterContainer"><div class="FilterSeoGroup FilterSeoGroup__seo" id="popularCollections"><h4 class="FilterSeoGroup__header">Популярные подборки</h4><div class="FilterSeoGroup__group_closed"><div class="FilterSeoGroup__item-wrapper"><a class="FilterSeoGroup__item" href="https://www.citilink.ru/catalog/monobloki--nedorogie-monobloki/">Недорогие</a></div><div class="FilterSeoGroup__item-wrapper"><a class="FilterSeoGroup__item" href="https://www.citilink.ru/catalog/monobloki--dlya-doma-m/">Для дома</a></div><div class="FilterSeoGroup__item-wrapper"><a class="FilterSeoGroup__item" href="https://www.citilink.ru/catalog/monobloki--dlya-ofisa-m/">Для офиса</a></div><div class="FilterSeoGroup__item-wrapper"><a class="FilterSeoGroup__item" href="https://www.citilink.ru/catalog/monobloki--win/">с Windows</a></div><div class="FilterSeoGroup__item-wrapper"><a class="FilterSeoGroup__item" href="https://www.citilink.ru/catalog/monobloki--imac/">Apple iMac</a></div></div><div class="FilterSeoGroup__toggle-container"><button class="FilterSeoGroup__toggle-button buttonStyleDecorator buttonStyleDecorator_theme_ghostOrange buttonStyleDecorator_size_s Button" name="" type="submit" value="" tabindex="0" borderstyle="none"><span class="buttonStyleDecorator__text ">Показать все</span></button></div></div></div></div>'

которое передается клиенту в виде переменной data.msg. Ссылка на неполный код в jsfiddle - https://jsfiddle.net/vladdvin/k9v6y0cw/2/ (полный код - https://disk.yandex.ru/d/VpPvrgMVE6R4Fw). Подскажите как добиться отображения правого бокового меню с помощью ajax.