jQuery Live data search

<!DOCTYPE html>
<!--suppress ALL -->
<html>
<head>
    <title></title>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


</head>
<body>

<ul id="info"></ul>


<p> Name: <input type="text"  value="apel" id="name"> </p>
<p> Drink: <input type="text" id="drink"> </p>


<button id="click">Click</button>

<div id="result">


</div>


<script type="text/javascript">
    $(document).ready(function () {


        $( '#name' ).keyup(function() {

            var  inputName = $( '#name' ).val();
            //console.log(inputName);

            $('#result').load('test.php table', {name:inputName});
        });


        /*
                $('#name').keypress(function () {
                    console.log('apel');
                }),
        */


        $('#click').on('click',function () {

            $('#result').load('test.php table', {name:'A'});
        });


/*
        $.ajax({
            url: "test.php",
            cache: false
        })
            .done(function( html ) {
             // console.log(nameid);

                $( "#result" ).append( html );
            });*/
    });


    /*$(document).ready(function () {
        var x = {
            name :'orko',
            hobi: 'photograpy'
    }

    console.log(x)


        $.get("https://unsplash.com/t/wallpapers", function(html){
            var txt = $(html).find('a');


            for (i=0; i<txt.length;i++) {

                var link= txt[i].title.split(' ').join('');

                if( link == 'Downloadphoto' ) {


                    var img = '<img style="width:  100px; height: 100px;" src='+ txt[i].href +'>';

                    $('#result').append(img);

                    console.log(txt[i].href);

                }

            }

            console.log(txt.length);

           // $("#wikiModal h4.modal-title").text(txt);
        });


    });*/

    /*var $list = $('#info');

    var $name = $('#name');
    var $drink = $('#drink');

    $(function () {

        $.ajax({
            type: 'GET',
            dataType: 'json',
            url: 'info.json',
            success: function (datas) {

                $.each(datas, function (i, data) {

                    $list.append( '<li>'+  data.name  +'</li>');

                    console.log(data.age);
                })
            }
        });

        $('#add').on('click', function () {
            var  order ={

                drink: $drink.val(),
                name: $name.val(),

            };

         $.ajax({

             type: 'POST',
             url: 'info.json',
             data: order,

             success:function (newOrder) {

                 $list.append( '<li>'+  newOrder  +'</li>');
             },

             error:function () {

                 console.log('error');
             }

         })

        })

    })*/

</script>

</html>