Can't get JQuery Typeahead/Autocomplete to work (ASP.NET Core)

I'm using the most basic implementation of the JQuery Typeahead functionality and I cannot get it to work on my ASP.NET Core app. Code inspection reveals no errors and everything looks like is should work. Would appreciate any help from you veterans of coding out there!

Here's my _Layout.cshtml file:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>@ViewData["Title"] - Test</title>

    <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
    <link rel="stylesheet" href="~/css/site.css" />
</head>
<body>
    <div class="container">
        <main role="main" class="pb-3">
            @RenderBody()
        </main>
    </div>

    <script src="~/lib/jquery/jquery.js"></script>
    <script src="~/lib/typeahead.js/typeahead.jquery.js"></script>
    <script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>

    <script src="~/js/site.js" asp-append-version="true"></script>
    @RenderSection("Scripts", required: false)
</body>
</html>

And here's the Index.cshtml

 @{
    ViewData["Title"] = "Home Page";
}
    <br />
    <input id="type-ahead" type="text" class="form-control" />

     @section Scripts {
            <script type="text/javascript">
                $("#type-ahead").typeahead({
                    source: { data: ["This", "That", "Whatever"]}
                });</script>
        }

When I type anything, the autocomplete NEVER kicks in. Again, no errors in the console.

Thanks a bunch.

--- Val

Solution

I finally got it to work. I replaced the [email protected] library with [email protected]

Then I surrounded my input with the following:

<div class="typeahead__container">
    <input id="type-ahead" type="text" class="form-control"/>
</div>