Question

I have the following code and its not working. I want to put the selected text to my selected-locations div. Any ideas? Thanks!

    <select name='available_locations' class='select-location'>
        <option value='Germany'>Germany</option>
        <option value='Venice'>Venice</option>
        <option value='Spain'>Spain</option>
    </select>

    <div id='selected-locations'>

    </div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type='text/javascript'>
    $(document).ready(function() {

        $('.select-location').change(function(){

                        var location = $( this ).attr( 'value' );
                        alert( location );
                        //new_text = $('#selected-locations').val() + location;
                        $('div.selected-locations').text( location );


        });

    });

</script>

Answer 1

You need to read up on css selectors and jQuery selectors

$('div.selected-locations').text( location );

should be

$('div#selected-locations').text( location );

OR

<div id='selected-locations'>

</div>

shoould be

<div class='selected-locations'>

</div>