Skip to main content

jQuery Insert alphabetically into a List

By Sam Deering



😳 Ever felt a little embarassed sharing your JavaScript? Let's fix it.

This function will insert items into an order alphabetically (assuming it contains letters). Initially design to make a smooth single page load/save feature that sorted everything in drop down lists, you guessed it, alphabetically. Can simply be modified to work in any sort of layout (ordered lists was just easier for the example).

function insert(){
    var name = $("input[name='insertvalue']").val();
        var toinsert = true;
        $("ol.thelist > li").each(function(){
            var item = $(this).html();
            if(name.toUpperCase() < item.toUpperCase()){
  • '+name+''); toinsert = false; } } }); if(toinsert){ $("ol.thelist").append('
  • '+name+'
  • '); } $("input[name='insertvalue']").val('') } }

    Sam Deering has 15+ years of programming and website development experience. He was a website consultant at Console, ABC News, Flight Centre, Sapient Nitro, and the QLD Government and runs a tech blog with over 1 million views per month. Currently, Sam is the Founder of Crypto News, Australia.

    New books out now!

    💁‍♀️ Fun Fact: Python was ranked #2 on a recent highest paid coders list. *

    🤓 Ok. When did a code editor from Microsoft become kinda cool!?