Append element that contains what is typed to another element

I have 3 plus list that I’m make easier for user to find what they are looking for. I want the element that contains what matches what the user typed tot he very top of of the list and into another element. my code looks like below. How can I achieve this please?

$(function () {
    
    var $showYourself = $('.name').text;
      var $rollCall = $('input#sort-plate').text;
    
    if($showYourself === $rollCall) {
      
        $('.sort-plate').appendTo('#show-here');
        
    }
    
    

    $('.name').html(function (i, html) {

        return $.trim(html).replace(/(\w+)$/, '<span class="sort-by">$1</span>');
    });

    var $sortPlate = $("#plate");
    $sortPlate.find(".sort-plate").detach().sort(function (a, b) {
        return $(a).find('.sort-by').text().localeCompare($(b).find('.sort-by').text());
    }).appendTo($sortPlate);

});

Link to the full code in jsFiddle

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.