WrongCode

function attachEvents(){

    const bUrl = 'https://baas.kinvey.com/';
    const appKey = 'kid_ryfZ8eGYE';
    const endPoint = 'biggestCatches';
    const userName = 'StanZash1';
    const password = '123456';
const headers = {
    'Authorization': `Basic ${btoa(userName + ':' + password)}`,
    'Content-Type': 'application/json'
};

$('.load').on('click', loadCatches);


$('.add').on('click', addCatch);

async function loadCatches(){

    $('#catches').empty();
    let catches = await $.ajax({
        url: bUrl + 'appdata/' + appKey + '/' + endPoint,
        method: 'GET',
        headers
            });
           for (let el of catches){
           let div = $(`
            <div class="catch" data-id="${el._id}">
            <label>Angler</label>
            <input type="text" class="angler" value="${el.angler}"/>
            <label>Weight</label>
            <input type="number" class="weight" value="${el.weight}"/>
            <label>Species</label>
            <input type="text" class="species" value="${el.species}"/>
            <label>Location</label>
            <input type="text" class="location" value="${el.location}"/>
            <label>Bait</label>
            <input type="text" class="bait" value="${el.bait}"/>
            <label>Capture Time</label>
            <input type="number" class="captureTime" value="${el.captureTime}"/>
        </div>
        `)
        let updateBtn = $('<button class="update">Update</button>');


        let deleteBtn = $('<button class="delete">Delete</button>');

        updateBtn.on('click', console.log('d'));
        deleteBtn.on('click', console.log('s'));

        div.append(updateBtn)
        div.append(deleteBtn)

        $('#catches').append(div);


    }

 }

async function addCatch(){

        let angler = $('#addForm input.angler').val();
        let weight = +$('#addForm input.weight').val();
        let species = $('#addForm input.species').val();
        let location = $('#addForm input.location').val();
        let bait = $('#addForm input.bait').val();
        let captureTime = +$('#addForm input.captureTime').val();

let catchObj = {
    angler,
    weight,
    species,
    location,
    bait,
    captureTime
};

await $.ajax({
    url: bUrl + 'appdata/' + appKey + '/' + endPoint,
    method: 'POST',
    headers,
    data: JSON.stringify(catchObj)
})
loadCatches();
      }


async function updateCatch(){

console.log('d');

//      console.log($(this));

//     let angler = $(this).parent().find('input.angler').val();
//     let weight = +$(this).parent().find('input.weight').val();
//     let species = $(this).parent().find('input.species').val();
//     let location = $(this).parent().find('input.location').val();
//     let bait = $(this).parent().find('input.bait').val();
//     let captureTime = +$(this).parent().find('input.captureTime').val();

// let newCatch = {
// angler,
// weight,
// species,
// location,
// bait,
// captureTime
// };

// let id = $(this).parent().data('id');
// try{



// await $.ajax({
//         url: bUrl + 'appdata/' + appKey + '/'+endPoint+'/'+id,
//         method: 'PUT',
//         data: JSON.stringify(newCatch),
//         headers

//     });

// }catch(err){
//     console.log(err);
// }
// loadCatches()
 }
 function deleteCatch(){

 }

}