Working with autocomplete events

The autocomplete widget exposes a range of unique events that allow us to react programmatically to the widget being interacted with. These events are listed as follows:

Event	Fired when...
change	A suggestion from the list is selected. This event is fired once the list has closed and the <input> has lost focus.
close	The suggestion list is closed.
create	An instance of the widget is created.
focus	The keyboard is used to focus a suggestion in the list.
open	The suggestion menu is displayed.
search	The request for the suggestions is about to be made.
select	A suggestion from the list is selected.

The select event is useful when we are working with an array of objects as the data source and have additional data other than the label and value properties that we used earlier. For the next example, remove the <div> container that we used in the last example and then change the configuration object, so that it appears...