Inventory searchbar

by Johnathan Amrein

HTML

<!DOCTYPE html>
    <base target="_top">
  <body>
    <p>Click on the ingredient you want to find in inventory and then click search.</p>
    <button onclick="google.script.run.onSearch()">Search</button>
    <br>
    <br>
    <div id="foo">Results</div>
  </body>

JavaScript

function onOpen() {
  SpreadsheetApp.getUi()
      .createMenu('Costing Tools')
      .addItem('Search menu', 'showSidebar')
      .addToUi();
}
function showSidebar() {// Brings up side bar to do inventory search
  var html = HtmlService.createHtmlOutputFromFile('page')
      .setTitle('Inventory search')
      .setWidth(300);
  SpreadsheetApp.getUi()
      .showSidebar(html);
}
function onSearch() { //When the search button is pressed it loops through the inventory list and finds exact matches eventually I'd like it to be smart
  var ui = SpreadsheetApp.getUi();
  var ingredient = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet().getActiveCell().getValue(); //user focus, they click on the item they want to search
  Logger.log('i ' + ingredient);//debug
  var isheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("INVENTORY");
  var columnValues = isheet.getRange("G:G").getValues(); //inventory list
  var i = columnValues.length, array, flag = false, matches = [];
  while(i --) {  //walk through columnValues
    array = columnValues[i];//get the ingredient in the li
    if(-1 !== array.indexOf(ingredient)){  //-1, string not found
      flag = true;
      matches.push(array);
      }
    }
    if(!flag) {
    ui.alert('No match found.');
    } 
  else {
      Logger.log('m ' + matches);//debug
      function makeUL(arr) {//This function not working 
      var list = document.createElement('ul'); // Create the list element
      Logger.log(list);//debug
      for(var i = 0; i < arr.length; i++) {//loop through the array to make the list
        var item = document.createElement('li'); // Create the list item
        item.appendChild(document.createTextNode(arr[i]));// Set its contents
        Logger.log(item);//debug
        list.appendChild(item);// Add it to the list
    }
    Logger.log(list);//debug
    return list;
}
    document.getElementById('foo').appendChild(makeUL(matches));//this doesn't work
    }
    }