Chosen Jquery plugin not changing HTML select – Blancer.com Tutorials and projects

I’m trying to change the select tag from html to the ones used in the example on the
Chosen v1.8.7, but even after following the steps the select continues as the default one:

test.html

<head>
    <link rel="stylesheet" href="chosen.css">
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">

    <script src="chosen.jquery.js" type="text/javascript"></script>
    <script src="chosen.jquery.min.js" type="text/javascript"></script>
</head>

<body>
    <select name="selecao" id="selecione" class="select">
        <option value="BMW">BMW</option>
        <option value="Volvo">Volvo</option>
        <option value="Volkswagen">Volkswagen</option>
    </select>
    <script>
        $(document).ready(function(){
            $(".select").chosen();
        });
    </script>
</body>

Expected result: the HTML select changed to the one found in the Chosen v1.8.7

Actual result: select tag not changed