How do I tell ajax to take input or whatever from the block I clicked on?

Question

JavaScript

<div class="music__center">
                    <div class="playerms">   
                        <button class="click"><input type="hidden" value="<?= $new['id'] ?>"><img class="img__pl2" src="" alt=""></button>
                        <div class="name"><?= $new['name'] ?></div>
                    </div>
                </div>

$(document).ready(function() {
    $('button').on('click', function() { ? ? ? ? ? ? ? ?
        var id = $('button').val(); ? ? ? ? ? ? ? ? ? ?
        $.ajax({
            type: "POST",
            url: "http://192.168.1.47/include/music_vid.php",
            dataType: "html",
            data: { id: id },
            success: function(ress) {
                result = $.parseJSON(ress);
                $('#aud').html('<audio id="audio" autoplay src="http://192.168.1.47/' + result.src + '"></audio>');
                $('.music__img').html('<img class="img_i" src="http://192.168.1.47/' + result.img + '">');
                $('.name_i').html(result.name);
                result2 = $.parseJSON(ress);
                $('.script_mus').html('<script src="http://192.168.1.47/' + result2.script + '"></script>');
            }
        })
    });
});

Answer 1

The $(this) inside function() {} is the jQuery instance of the button you are currently clicking on.
find() - can selector select elements within a given jQuery instance.
Something like this means:

$('button').on('click', function() {
        var id = $(this).find('input').val();
...