why Ajax code not trigger on click or load

  ajax, javascript, jquery, model-view-controller

Thanks for you all.

I am new in coding MVC, and I am trying to code a page that will create and

  • as parent and child loop, using data from JSON (MenuHandler.ashx), the JSON data is tested and it’s ok, but the Ajax was not working.

    for your kind note: the Alert working before and after Ajax

    this is my VIEW page:

     <script type="text/javascript">
            $(document).ready(function () {
                $("#testaj1").click(function () {
                    alert ("test22")
                        url: 'MenuHandler.ashx',
                        method: 'get',
                        dataType: 'json',
                        success: function (data) {
                            buildMenu($('#menu'), data)
                function buildMenu(parent, items) {
                    $.each(items, function () {
                        var li = $('<li>' + this.Name + '</li>');
                        if (this.List && this.List.length > 0) {
                            var ul = $('<ul></ul>');
                            buildMenu(ul, this.List);
     <link href="~/Content/MyCSS/MyCSS.css" rel="stylesheet" />
    @model IEnumerable<pedigree.Models.pedigree1>
        Layout = null;
    <!DOCTYPE html>
        <meta name="viewport" content="width=device-width" />
        <script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
        <script src="~/Scripts/jquery-3.5.1.js"></script>
        <script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>
            @Html.ActionLink("Create New", "Create")
            <button id="testaj1" type="button" >test</button>
            <div class="tree">
                <ul id="menu">

    Source: Ask Javascript Questions