WebUI: Use event delegation to handle common table events

Event delegation is now used to handle basic table events.
2 minor fixes were added to match GUI behavior:
* Clicking on the table body deselects everything
* Table rows are now scrolled into view when using up/down arrows

PR #21829.

src/webui/www/private/css/dynamicTable.css

@@ -22,10 +22,6 @@
     color: var(--color-text-white);
 }
 
-#transferList tr:hover {
-    cursor: pointer;
-}
-
 #transferList img.stateIcon {
     height: 1.3em;
     margin-bottom: -1px;
@@ -37,10 +33,6 @@
     display: flex !important;
 }
 
-tr.dynamicTableHeader {
-    cursor: pointer;
-}
-
 .dynamicTable {
     border-spacing: 0;
     padding: 0;
@@ -54,6 +46,10 @@ tr.dynamicTableHeader {
     white-space: nowrap;
 }
 
+.dynamicTable tr:hover {
+    cursor: pointer;
+}
+
 .dynamicTable tr:is(:hover, .selected) img:not(.flags) {
     filter: var(--color-icon-hover);
 }

src/webui/www/private/css/style.css

@@ -861,10 +861,6 @@ td.statusBarSeparator {
     color: var(--color-text-green);
 }
 
-.searchPluginsTableRow {
-    cursor: pointer;
-}
-
 #torrentFilesTableDiv .dynamicTable tr.nonAlt:hover {
     background-color: var(--color-background-hover);
     color: var(--color-text-white);