Experimenting further I am able to get this to work now and improve it too.
Originally, I had a problem where when I put this function into my js file it would not fire. It would only work if i added it to my functions.php file just below the form.
I figured out that I needed to use a jquery .on statement and now when I start typing in the search field the function is triggered. I also like that I can now have all of the javascript in the js file.
Here is what i ended up with – this wrapped in a jquery document ready function:
function dmtSearchFunction() {
console.log('cheers');
// Declare variables
var filter, li, i, dataArray;
filter = jQuery('#dmt-filter-search').val().toUpperCase();
li = jQuery("#dmt-choice-list li.choice-item");
console.log('filter: ' + filter);
console.log('li: ' + li);
console.log('li length: ' + li.length);
var dataArray = new Array();
for (i = 0; i < li.length; i++) {
var dataArray = jQuery(li[i]).data('text');
if(dataArray.toUpperCase().indexOf(filter) > -1){
jQuery(li[i]).css('display', 'block');
} else {
jQuery(li[i]).css('display', 'none');
}
}
}
jQuery( ".filter-dmt-search" ).on( "keyup", "input", dmtSearchFunction );
Working!