JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<form id='searchForm'>
    <input type="text" name="search" class="Search_bar_box" id="search">
</form>

JavaScript

$(function () {

    var availableTags = [

        "Telehandlers",

        "Cranes",

        "Fork Attachments",

        "Aggreko",

        "12 Tonne Telhandlers",

        "Marwood",

        "Crane Suppliers in Manchester",

        "Total",

        "Oil, Gas & Lubricants",

        "Tomato Plant"

    ];

    $("#search").autocomplete({

        source: availableTags,
        select: function (event, ui) {
            alert(ui.item.value);
        }

    });

    $('#searchForm').on("submit", function (event) {
        event.preventDefault();
        alert($('#search').val());
    });


});