Autocomplete text box with values from mysql WordPress database

I have code that successfully works on my XAMPP server using my localhost database.

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<script>
$(function() {
    var availableTags = [

        <?php

        $Database = "~";
        $DatabaseUserName = "~";
        $DatabasePass = "~";

        $connect = mysql_connect("~", $DatabaseUserName, $DatabasePass);
        @mysql_select_db($Database) or ("Database not found");

        $query = "SELECT ~ FROM ~";
        $result = mysql_query($query) or die ( $result."<br/><br/>".mysql_error());

        while ($row = mysql_fetch_array($result)) {
        echo """. $row['~']."", ";
        }

        // $result = mysql_query($query) or die ( $result."<br/><br/>".mysql_error());

        mysql_close($connect);

        ?>
    ];

    $( "#tags" ).autocomplete({
        source: availableTags
    });
});
</script>

Then, the form input text field (in a table) has an id of “tags”:

<tr>
    <td>
        <label for="~"><b>~</b><font color="red">*</font>:</label>
    </td>
    <td>
            <input id="tags" name="~" style="width: 250px;" onblur="~">
            <p id="~"></p>
    </td>

</tr>

What I’m trying to do is the exact same thing (autocompleting text box based on values in a MySQL database [in this case, WordPress]) for my WordPress site.