I want to access first $(this) from the second level in jquery

Question

i want to get the data attribute on the second level

$('.filter-select').each(function() {
        console.log($(this).data()) // this gives me all data 
        $(this).on('change', function() {
            console.log($(this).data()) // but here gives me only on that i clicked i want it all
        })

    })

user_18312347 · Answer

You can simply:

$('.filter-select').each(function() {
        const allData = $(this).data();
        $(this).on('change', function() {
            // use allData to access all
        })

    })

user_1377002 · Answer

Instead of using each, and then trying to attach event listeners to each .filter-select element use event delegation to attach a listener to a parent element so that it captures the change events from all the .filter-select elements as they "bubble up" the DOM.

$(document).on('change', '.filter-selector', handleChange);

function handleChange() {
  console.log($(this).data());
}

I want to access first $(this) from the second level in jquery

2 Answers