user3612445
user3612445

Reputation: 145

get selected item from select

I have a button to add dynamically new divs and this divs contains a select:

    <script  type="text/javascript">
    var counter = 1;
    var limit = 10;
    function addInput(divName) {
        if (counter == limit) {
            alert("You have reached the limit of adding " + counter
                    + " inputs");
        } else {
            var newdiv = document.createElement('div');
            newdiv.setAttribute("id", 'filter'+counter);
            newdiv.innerHTML = "<br><div class='widget-content'>Filter" + (counter) + "<br> <select id='selecto'><option>Flowers</option><option>Shrubs</option><option>Trees</option><option>Bushes</option></select></div> ";
            document.getElementById(divName).appendChild(newdiv);
            counter++;
        }
    }


</script>

I want to handle an event when I select one option, I've tried this but hasn't worked:

$('#selecto').change(function(){ 
    var value = $(this).val();
    alert(value);
});

Why didn't work? Thx a lot.

Upvotes: 0

Views: 60

Answers (1)

Oleksandr T.
Oleksandr T.

Reputation: 77482

Use need use event delegation

$('body').on('change', '#selecto', function() { 
    var value = $(this).val();
    alert(value);
});

Upvotes: 2

Related Questions