Problem with sweetalert confirm link

Good morning,

I am somewhat confused since I tried to make a confirmation modal before going to a link (basically before deleting an item from the DB, asking if it is safe) using sweetalert2 and I get several errors that I can not / I can solve.

This is the code

  <a id="confirm" href="http://google.com">Visit Google!</a>

  <script>
  $("#confirm").click(function(e) {
    e.preventDefault(); // Prevent the href from redirecting directly
    var linkURL = $(this).attr("href");
    warnBeforeRedirect(linkURL);
  });

  function warnBeforeRedirect(linkURL) {
    swal({
      title: "Leave this site?", 
      text: "If you click 'OK', you will be redirected to " + linkURL, 
      type: "warning",
      buttons: true
    }).then( function() {
      window.location.href = linkURL;
    });
  }
  </script>

With this code, if you give it to cancel when the modal appears, it still keeps taking you to the page. Does anyone know why?

On the other hand, I do not get to understand another rather strange concept. If I put the id confirm elsewhere, exactly in this code:

<ul class="page-breadcrumb">
<li> <a id="confirm" href="<?php echo $CRDomain; ?>dashboard">Inicio</a> <i class="fa fa-circle"></i> </li>
<li> <span>Usuarios</span> </li>
</ul>

The confirm does not work, nor show the modal or anything, it goes to the link directly.

Could someone help me?

---------------------------------

After using the response code, I still have a problem that I can not find the sense of:

<ul class="dropdown-menu" role="menu">
    <li>
        <a href="<?php echo $CRDomain; ?>profile?user=<?php echo $u['IDUser']; ?>"><i class="fa fa-eye" aria-hidden="true"></i> Ver Perfil </a>
    </li>
    <li>
        <?php if($u['Activacion'] == 1): ?>
        <a href="../assets/controllers/users.php?action=desactivaruser&userid=<?php echo $u['IDUser']; ?>"><i class="fa fa-toggle-off" aria-hidden="true"></i> Desactivar </a>
        <?php elseif($u['Activacion'] == 0): ?>
        <a href="../assets/controllers/users.php?action=activaruser&userid=<?php echo $u['IDUser']; ?>"><i class="fa fa-toggle-on" aria-hidden="true"></i> Activar </a>
        <?php endif; ?>
    </li>
    <li>
        <a href="javascript:;"><i class="fa fa-pencil" aria-hidden="true"></i> Editar </a>
    </li>

<script type="text/javascript">
$("#confirmBTN").click(function(e) {
e.preventDefault(); 
var linkURL = $(this).attr("href");
warnBeforeRedirect(linkURL);
});
function warnBeforeRedirect(linkURL) {
swal({
title: "¿Estas segur<?php get_Genero($_SESSION['CBSGenero']); ?>?",
text: "Una vez borrado el usuario, no podrá ser recuperado.",
type: "warning",
showCancelButton: true,
}).then(function(result) {
console.log(result);
if (result.value) {
window.location.href = linkURL;
}
});
}
</script>

    <li>
        <a id="confirmBTN" href="../assets/controllers/users.php?action=eliminaruser&userid=<?php echo $u['IDUser']; ?>"><i class="fa fa-trash" aria-hidden="true"></i> Eliminar </a>
    </li>
    <li class="dropdown-header">Permisos</li>
    <li>
        <a href="javascript:;"><i class="fa fa-eye" aria-hidden="true"></i> Ver o Editar </a>
    </li>
</ul>

This is the code. When I hit the "delete" button it does not show the confirmation screen, it just goes to the link directly. There is no id="confirmBTN" defined or anything like that, so it should work correctly ... I have reviewed the code and I do not see any apparent error ... so I'm a little lost.

Does anyone know why?