I want to update options of another select2 multiselect component based on selected value of first select2 component

Question

I want to update options of another select2 multiselect component based on selected value of first select2 component

as you can see approach that I tried below, but its not accurate, how can I get to know whats the value that got selected instead of retrieving all selected values of multiselect

 $('#id_old_states').on("change", function (){

        let name = $('#id_old_states').select2('data')[0]["text"]
        let id = $('#id_old_states').select2('data')[0]["id"]

        $('#id_new_states').select2({
            theme: "classic",
            multiple: true,
            placeholder: "Select States",
        }).prepend(new Option(name, id, false, false))
        
    });

Answer 1

    $('#mySelect2').on('select2:select', function (e) {
    var data = e.params.data;
    console.log(data);
});