Version 3.1.0 => Release History for details

README.md

@@ -19,7 +19,7 @@
 <br>
 <br>
 
-> Simple autocomplete pure vanilla Javascript library. <a href="https://tarekraafat.github.io/autoComplete.js/demo/" target="\_blank">:rocket: Live Demo</a> **v3.0**
+> Simple autocomplete pure vanilla Javascript library. <a href="https://tarekraafat.github.io/autoComplete.js/demo/" target="\_blank">:rocket: Live Demo</a> **v3.1**
 
 autoComplete.js is a simple pure vanilla Javascript library that's progressively designed for speed, high versatility and seamless integration with wide range of projects & systems, made for users and developers in mind.
 
@@ -52,13 +52,13 @@ git clone https://github.com/TarekRaafat/autoComplete.js.git
 `CSS`
 
 ```html
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/TarekRaafat/autoComplete.js@3.0.0/dist/css/autoComplete.min.css">
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/TarekRaafat/autoComplete.js@3.1.0/dist/css/autoComplete.min.css">
 ```
 
 `JS`
 
 ```html
-<script src="https://cdn.jsdelivr.net/gh/TarekRaafat/autoComplete.js@3.0.0/dist/js/autoComplete.min.js"></script>
+<script src="https://cdn.jsdelivr.net/gh/TarekRaafat/autoComplete.js@3.1.0/dist/js/autoComplete.min.js"></script>
 ```
 
 -   <a href="https://www.npmjs.com/package/@tarekraafat/autocomplete.js">npm</a> install `(Node Package Manager)`

dist/js/autoComplete.js

@@ -39,6 +39,9 @@
   var createResultsList = function createResultsList(renderResults) {
     resultsList = document.createElement("ul");
     resultsList.setAttribute("id", select.resultsList);
+    if (renderResults.container) {
+      renderResults.container(resultsList);
+    }
     renderResults.destination.insertAdjacentElement(renderResults.position, resultsList);
   };
   var highlight = function highlight(value) {
@@ -128,8 +131,9 @@
       this.searchEngine = config.searchEngine === "loose" ? "loose" : "strict";
       this.threshold = config.threshold || 0;
       this.resultsList = autoCompleteView.createResultsList({
-        destination: config.resultsList ? config.resultsList.destination : autoCompleteView.getInput(this.selector),
-        position: config.resultsList ? config.resultsList.position : "afterend"
+        container: config.resultsList.container,
+        destination: config.resultsList.destination ? config.resultsList.destination : autoCompleteView.getInput(this.selector),
+        position: config.resultsList.position ? config.resultsList.position : "afterend"
       });
       this.placeHolder = config.placeHolder;
       this.maxResults = config.maxResults || 5;

dist/js/index.js

@@ -19,6 +19,9 @@ const autoCompletejs = new autoComplete({
 	highlight: true,
 	maxResults: Infinity,
 	resultsList: {
+		container: source => {
+			source.classList.add("foodList");
+		},
 		destination: document.querySelector("#autoComplete"),
 		position: "afterend"
 	},