Lancer un plugin jquery sur un élément créé dynamiquement

Bonjour à tous,

J'ai tourné en rond pendant des heures et j'ai besoin d'aide.

J'utilise ce plugin: https://selectric.js.org/ pour personnaliser les balises <options> des mes select. Le plugin fonctionne bien sur les éléments présents dans le DOM au chargement de la page mais pas sur les éléments ajoutés dynamiquement et mon problème vient de là.

En gros, comment invoquer le plugin sur les <select> ajoutés dynamiquement.

J'ai crée un fiddle pour reproduire mon code actuel, dans l'idée, mais je ne sais pas comment inclure la librairie selectric (désolé)...

https://jsfiddle.net/efdzvxb5/

Si vous avez d'autres suggestions de plugins simples à utiliser, je suis preneur. Le but étant que je puisse customiser le CSS et l'invoquer sur les éléments ajoutés dynamiquement. Je ne suis pas un pro en JS..

Merci
Modifié par allan00958 (02 Nov 2020 - 19:33)

Salut !
Avec ces ligne, tu pourra save dans une variable l'index de l'option sélectionnée sur ton dernier <select> ( c'est du javascript, je suis désolé j'ai abandonné jQuery depuis quelques temps ) :

    const select = document.querySelectorAll('select');
    var selected_option;

    for(let k = 0; k < select.length; k++) {
        if(k == select.length - 1) {
            select[k].onchange = function() {
                selected_option = select[k].selectedIndex;
            }
        }
    }

Et si après avoir clone ce dernier élément, tu veux afficher l'option qui avait été sélectionnée :

    const btn = document.getElementById('btn');
    
    btn.onclick = function() {
        for(let j = 0; j < select.length; j++) {
            if(j == select.length - 1) {
                select[j].onchange = function() {
                    select[j].selectedIndex = selected_option;
                }
            }
        }    
    }

J'ai fait ce code un peu à l'arrache mais y'a de l'idée, si quelqu'un qui lit ce poste voit une erreur hésitez pas ( j'ai pas tester le code )

Bonne soirée à toi !
Modifié par vzytoi (02 Nov 2020 - 21:46)

Merci pour ton intervention @vzytoi.

Ce n'est pas vraiment ça. Mon souci était que le plugin ne fonctionnait pas sur les éléments ajoutés dynamiquement.

J'ai décidé de changer de plugin et d'utiliser celui-la, beaucoup plus simple:
https://jqueryniceselect.hernansartorio.com/