$(this) Is Selecting Window Object Instead Of Clicked Element Jquery

I have a really strange issue. I simply want to select a clicked element. I did this a lot of times and it always worked but this time, the jQuery $(this) selector doesn't select t

Solution 1:

It's because you're using an arrow function. The scope of the contents of this function do not change as per a standard function definition. For this to work you'll need to change the logic:

$(document).ready(() => {
  $('.delete-file').on('click', function() {
    let element = $(this);
    console.log(element);
  });
});

Alternatively you could keep the arrow function and retrieve a reference to the clicked element through the target property of the event that's raised:

$(document).ready( () => {
  $('.delete-file').on('click', e => {
    let element = $(e.target);
    console.log(element);
  });
});