Selectron from tag div:

Fusion applied to usual drop-down:

Created by code:

        
//demo
document.getElementById('drop-down-example3').addEventListener('change', function () {
    console.log('event attached to the :', this.value)
});

let data1 = {
    options: [
        {
            value: 'usd',
            title: 'USD',
            text: 'United States Dollar',
            img: 'https://pluginus.net/wp-content/uploads/2021/03/united_states_of_america.gif'
        },
        {
            value: 'eur',
            title: 'EUR',
            text: 'European Euro',
            img: 'https://pluginus.net/wp-content/uploads/2021/03/european_union.gif'
        },
        {
            value: 'uah',
            title: 'UAH',
            text: 'Украинская гривна',
            img: 'https://pluginus.net/wp-content/uploads/2021/03/ukraine.gif'
        },
        {
            value: 'gbp',
            title: 'GBP',
            text: 'Great Britain pound',
            img: 'https://pluginus.net/wp-content/uploads/2021/03/united_kingdom.gif'
        }
    ],
    label: 'Select currency',
    selected: 'uah',
    width: '100%',
    imgpos: 'right',
    //name: 'my_value', //hidden input name
    fusion: false, //use if wrap  to fuse titles by keys with options description here
    max_open_height: 200, //max height (px) of opened drop-down when vertical scroll appears
};

var selector1 = new Selectron23(document.querySelector('#block-example'), data1);

let data2 = Object.assign({}, data1);
data2.imgpos = 'left';
delete data2.max_open_height;
var selector2 = new Selectron23(document.querySelector('#block-example2'), data2);

//html5 drop-down wrapping
var selector3 = new Selectron23(document.querySelector('#drop-down-example3'), {});


//demo
selector1.onSelect = function () {
    console.log('selector1', this.value);
    document.getElementById('selector1-value').innerText = this.value;
};

selector2.onSelect = function () {
    console.log('selector2', this.value);
    document.getElementById('selector2-value').innerText = this.value;
};

selector3.onSelect = function () {
    console.log('selector3', this.value);
    document.getElementById('selector3-value').innerText = this.value;
};

function add_currency(value, num = 1) {

    let selector = null;
    if (parseInt(num) === 1) {
        selector = selector1;
    } else {
        selector = selector2;
    }

    if (selector.append({
        value: value,
        title: 'JPY',
        text: 'Japan Yen',
        img: 'https://pluginus.net/wp-content/uploads/2021/03/japan.gif'
    })) {
        selector.select(value);
    } else {
        alert('JPY already in!');
}
}