diff --git a/docs/release-notes/version-3.1.md b/docs/release-notes/version-3.1.md
index ad69b73b0..5ff6ea1bb 100644
--- a/docs/release-notes/version-3.1.md
+++ b/docs/release-notes/version-3.1.md
@@ -5,6 +5,7 @@
 ### Enhancements
 
 * [#8100](https://github.com/netbox-community/netbox/issues/8100) - Add "other" choice for FHRP group protocol
+* [#8134](https://github.com/netbox-community/netbox/issues/8134) - Fix issue where HTMX-swapped UI elements needed to be reinitialized
 
 ### Bug Fixes
 
diff --git a/netbox/project-static/dist/netbox.js b/netbox/project-static/dist/netbox.js
index 95fd99270..c15316ce8 100644
Binary files a/netbox/project-static/dist/netbox.js and b/netbox/project-static/dist/netbox.js differ
diff --git a/netbox/project-static/dist/netbox.js.map b/netbox/project-static/dist/netbox.js.map
index 6fbe0874b..ebab0d3a7 100644
Binary files a/netbox/project-static/dist/netbox.js.map and b/netbox/project-static/dist/netbox.js.map differ
diff --git a/netbox/project-static/src/htmx.ts b/netbox/project-static/src/htmx.ts
new file mode 100644
index 000000000..70ed4f534
--- /dev/null
+++ b/netbox/project-static/src/htmx.ts
@@ -0,0 +1,23 @@
+import { getElements, isTruthy } from './util';
+import { initButtons } from './buttons';
+
+function initDepedencies(): void {
+  for (const init of [initButtons]) {
+    init();
+  }
+}
+
+/**
+ * Hook into HTMX's event system to reinitialize specific native event listeners when HTMX swaps
+ * elements.
+ */
+export function initHtmx(): void {
+  for (const element of getElements('[hx-target]')) {
+    const targetSelector = element.getAttribute('hx-target');
+    if (isTruthy(targetSelector)) {
+      for (const target of getElements(targetSelector)) {
+        target.addEventListener('htmx:afterSettle', initDepedencies);
+      }
+    }
+  }
+}
diff --git a/netbox/project-static/src/netbox.ts b/netbox/project-static/src/netbox.ts
index 79c196b96..c178a2dbd 100644
--- a/netbox/project-static/src/netbox.ts
+++ b/netbox/project-static/src/netbox.ts
@@ -12,6 +12,7 @@ import { initInterfaceTable } from './tables';
 import { initSideNav } from './sidenav';
 import { initRackElevation } from './racks';
 import { initLinks } from './links';
+import { initHtmx } from './htmx';
 
 function initDocument(): void {
   for (const init of [
@@ -29,6 +30,7 @@ function initDocument(): void {
     initSideNav,
     initRackElevation,
     initLinks,
+    initHtmx,
   ]) {
     init();
   }