Impelenting Search Like Function in new form

Hello everyone, I have created a form that has a google search like function that when you type a letter it will give you suggestions from a database for you to continue filling the form. I have included the following js libraries ``` <link rel="stylesheet" href="[login to view URL]" /> <script src="[login to view URL]"></script> <script src="[login to view URL]"></script> <!-- Bootstrap Css --> <link href="[login to view URL]" rel="stylesheet">``` Code works perfectly here: <div class="container"> <div class="row"> <h2>Search Here</h2> <input type="text" name="search" id="search" placeholder="search here...." class="form-control"> </div> </div> <script type="text/javascript"> $(function() { $( "#search" ).autocomplete({ source: '[login to view URL]', }); }); However when I implement it in another form it will not work, I think It has something to do with ID attribute in new form . This is the code in the new form : <div class="form-group"> <input class="form-control-1" id="nombre-1" name="nombre" placeholder="Nombre:" required="" type="text"> </div> <script type="text/javascript"> $(function() { $( "#nombre-1" ).autocomplete({ source: '[login to view URL]', }); }); </script> I think I might be doing some mix up with ID attribute. Any help will be greatly appreciated. This is the php called. <?php require_once "[login to view URL]"; if (isset($_GET['term'])) { $query = "SELECT * FROM visitas WHERE nombre LIKE '{$_GET['term']}%' LIMIT 25"; $result = mysqli_query($conn, $query); if (mysqli_num_rows($result) > 0) { while ($user = mysqli_fetch_array($result)) { $res[] = $user['nombre']; } } else { $res = array(); } //return json res echo json_encode($res); } ?>