diff --git a/templates/user/settings/security_u2f.tmpl b/templates/user/settings/security_u2f.tmpl
index dcc56d8729..b33c9ae0e6 100644
--- a/templates/user/settings/security_u2f.tmpl
+++ b/templates/user/settings/security_u2f.tmpl
@@ -8,7 +8,7 @@
 			{{range .U2FRegistrations}}
 				<div class="item">
 					<div class="right floated content">
-						<button class="ui red tiny button delete-button" id="delete-registration" data-url="{{$.Link}}/u2f/delete" data-id="{{.ID}}">
+						<button class="ui red tiny button delete-button" modal-id="delete-registration" data-url="{{$.Link}}/u2f/delete" data-id="{{.ID}}">
 						{{$.i18n.Tr "settings.delete_key"}}
 						</button>
 					</div>
diff --git a/web_src/js/index.js b/web_src/js/index.js
index 1b096a31de..0a0cb12932 100644
--- a/web_src/js/index.js
+++ b/web_src/js/index.js
@@ -2959,8 +2959,8 @@ $(() => {
 function showDeletePopup() {
   const $this = $(this);
   let filter = '';
-  if ($this.attr('id')) {
-    filter += `#${$this.attr('id')}`;
+  if ($this.attr('modal-id')) {
+    filter += `#${$this.attr('modal-id')}`;
   }
 
   const dialog = $(`.delete.modal${filter}`);