Get value of multiselect box using jQuery or pure JS

Question

In the code shown below, how to get the values of multiselect box in function val() using jQuery or pure JavaScript?

<script>
    function val() {
        //Get values of mutliselect drop down box
    }

    $(document).ready(function () {
        var flag = 0;
        $('#emp').change(function () {
            var sub = $("OPTION:selected", this).val()
            if (flag == 1) $('#new_row').remove();
            $('#topics').val('');
            var html = '<tr id="new_row" class="new_row"><td>Topics:</td><td>  <select    id="topic_l" name="topic_l" class="topic_l" multiple="multiple">';
            var idarr = new Array();
            var valarr = new Array(); { %
                for top in dict.tops %
            }
            idarr.push('{{top.is}}');
            valarr.push('{{pic.ele}}'); { % endfor %
            }
            for (var i = 0; i < idarr.length; i++) {
                if (sub == idarr[i]) {
                    html += '<option value="' + idarr[i] + '" >' + valarr[i] + '</option>';
                }
            }
            html += '</select></p></td></tr>';
            $('#tops').append(html);
            flag = 1;
        });
    });
</script>
Emp:&nbsp;&nbsp;&nbsp;&nbsp;
<select id="emp" name="emp">
    <option value=""></option>
    <option value="1">1</option>
</select>

<div name="tops" id="tops"></div>

<input type="submit" value="Create Template" id="create" onclick="javascript:var ret=val();return ret;">

Answer 1

the val function called from the select will return an array if its a multiple. $('select#my_multiselect').val() will return an array of the values for the selected options - you dont need to loop through and get them yourself.