How to open a page with the right hashtag?

Question

JavaScript

Hello everyone, and in particular to front-enders and layout gurus.
How can I implement the opening of a tab in the following path '/***/#signatures'?
There is a navigation

<ul class="nav nav-tabs" id="orderlist" role="tablist">
                                <li class="nav-item">
                                    <a class="nav-link" id="general-tab" data-toggle="tab" href="#general" role="tab"
                                       aria-controls="general" aria-selected="true">General
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link active" id="package-tab" data-toggle="tab" href="#package"
                                       role="tab" aria-controls="package" aria-selected="false">Package
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link" id="payments-tab" data-toggle="tab" href="#payments" role="tab"
                                       aria-controls="payments" aria-selected="false">Payments
                                    </a>
                                </li>
                                <li class="nav-item" id="loan-tab-menu" t-att-style="'display: none' if contract.type == 'guest' else empty">
                                    <a class="nav-link" id="loans-tab" data-toggle="tab" href="#loans" role="tab"
                                       aria-controls="loans" aria-selected="false">Loans
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link" id="signatures-tab" data-toggle="tab" href="#signatures" role="tab"
                                       aria-controls="signatures" aria-selected="false">Signatures
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link" id="cards-tab" data-toggle="tab" href="#cards" role="tab"
                                       aria-controls="cards" aria-selected="false">Credit Cards
                                    </a>
                                </li>
                            </ul>

Single tab example

<div class="tab-pane" id="signatures" role="tabpanel" aria-labelledby="signatures-tab">

I go to '/***/#signatures', but this tab is not active.
It is necessary that a tab be activated with a specific hash tag and display the necessary data
.

$(function () {
    if (location.hash) {
        $(location.hash + '-tab').click();
    }
    $("a[data-toggle=tab]").on("click", function () {
        location.href = this.href;
    });
});

The question is how to move away from using the function and assign this work to the browser?