I want to filter the options of a large select group based on text input in a textbox. I am currently using this code to filter from a SELECT group based on the text of a input box.Can you please tell me whether there is a more efficient way of doing this? My SELECT group is very large with around 7000 entries, which is why I am looking for the most optimized way.<script>var fullcelllist = $();var lastVal =;$(window).load(function(){    $(#celllist option).each(function(){        fullcelllist.push($(this).val());    });});$(#filtercell).keyup(function() {    if(lastVal.length < $(this).val().length){        $(#celllist option:not([value*='+$(this).val().toUpperCase()+'])).each(function() {            $(this).remove();        });    }else{        stregexp = new RegExp($(this).val(),i);        temparr = $.grep(fullcelllist, function (value) {        if(value.match(stregexp)) return value;            return null;        });        newopt = ;        temparr.sort();        $.each(temparr,function(i){            newopt += <option value='+temparr[i]+'>+temparr[i]+</option>;         });        $(#celllist).html();        $(#celllist).append(newopt);    }    lastVal = $(this).val();});</script><input type=text id=filtercell><select id =celllist multiple=multiple>// HERE all OPTIONS using PHP<select>
Filtering a SELECT group using jQuery
javascript;jquery
Your jQuery could be somewhat more efficient if you minimize $(...) element look-ups by storing them as variables or chaining them.Also, I think you will see some benefit to replacing some jQuery constructs with their pure JS alternatives ($.each -> for, etc..)Check out this set of jsPerf tests from this StackOverflow answer.<script>var fullcelllist = $(),    lastVal =,    $celllistOption = $(#celllist option);// ...$(#filtercell).keyup(function() {    var $this = $(this),        $thisVal = $this.val();// ...