diff --git a/templates/zerver/app/index.html b/templates/zerver/app/index.html
index d3c1cf2fe2..7bdcf57d22 100644
--- a/templates/zerver/app/index.html
+++ b/templates/zerver/app/index.html
@@ -248,9 +248,9 @@
                         <div id="loading_older_messages_indicator"></div>
                         <div id="page_loading_indicator"></div>
                         <div id="message_feed_errors_container"></div>
-                        <div class="message_table focused-message-list" id="zhome" role="list" aria-live="polite" aria-label="{{ _('Messages') }}">
+                        <div class="message-list focused-message-list" id="zhome" role="list" aria-live="polite" aria-label="{{ _('Messages') }}">
                         </div>
-                        <div class="message_table" id="zfilt" role="list" aria-live="polite" aria-label="{{ _('Messages') }}">
+                        <div class="message-list" id="zfilt" role="list" aria-live="polite" aria-label="{{ _('Messages') }}">
                         </div>
                         <div id="typing_notifications">
                         </div>
diff --git a/web/src/message_list_tooltips.js b/web/src/message_list_tooltips.js
index 415712b77a..0644bb9de9 100644
--- a/web/src/message_list_tooltips.js
+++ b/web/src/message_list_tooltips.js
@@ -121,7 +121,7 @@ export function initialize() {
             }
 
             const config = {attributes: false, childList: true, subtree: true};
-            const target = $elem.parents(".message_table.focused-message-list").get(0);
+            const target = $elem.parents(".message-list.focused-message-list").get(0);
             const nodes_to_check_for_removal = [
                 $elem.parents(".recipient_row").get(0),
                 $elem.parents(".message_reactions").get(0),
@@ -174,7 +174,7 @@ export function initialize() {
         },
     });
 
-    message_list_tooltip(".message_table .message_time", {
+    message_list_tooltip(".message-list .message_time", {
         onShow(instance) {
             const $time_elem = $(instance.reference);
             const $row = $time_elem.closest(".message_row");
diff --git a/web/src/message_lists.js b/web/src/message_lists.js
index 9963d0967c..6aafb6cb76 100644
--- a/web/src/message_lists.js
+++ b/web/src/message_lists.js
@@ -21,7 +21,7 @@ export function all_rendered_message_lists() {
 }
 
 export function all_current_message_rows() {
-    return $(`#${current.table_name}.message_table .message_row`);
+    return $(`#${current.table_name}.message-list .message_row`);
 }
 
 export function update_recipient_bar_background_color() {
diff --git a/web/src/reactions.js b/web/src/reactions.js
index 256322a2cd..5e5689eea7 100644
--- a/web/src/reactions.js
+++ b/web/src/reactions.js
@@ -204,7 +204,7 @@ export function get_reaction_title_data(message_id, local_id) {
 }
 
 export function get_reaction_section(message_id) {
-    const $message_element = $(".message_table").find(`[zid='${CSS.escape(message_id)}']`);
+    const $message_element = $(".message-list").find(`[zid='${CSS.escape(message_id)}']`);
     const $section = $message_element.find(".message_reactions");
     return $section;
 }
diff --git a/web/src/ui_init.js b/web/src/ui_init.js
index 85405c525d..746e8838fb 100644
--- a/web/src/ui_init.js
+++ b/web/src/ui_init.js
@@ -329,12 +329,12 @@ export function initialize_kitchen_sink_stuff() {
         $("body").addClass("more_dense_mode");
     }
 
-    $("#main_div").on("mouseover", ".message_table .message_row", function () {
+    $("#main_div").on("mouseover", ".message-list .message_row", function () {
         const $row = $(this).closest(".message_row");
         message_hover($row);
     });
 
-    $("#main_div").on("mouseleave", ".message_table .message_row", () => {
+    $("#main_div").on("mouseleave", ".message-list .message_row", () => {
         message_unhover();
     });
 
diff --git a/web/styles/zulip.css b/web/styles/zulip.css
index 702d8c677c..71c7c62c7b 100644
--- a/web/styles/zulip.css
+++ b/web/styles/zulip.css
@@ -1683,7 +1683,7 @@ td.pointer {
     bottom: 4px;
 }
 
-div.message_table {
+div.message-list {
     border-collapse: separate;
     margin-left: auto;
     display: none;
diff --git a/web/tests/reactions.test.js b/web/tests/reactions.test.js
index bdf54195df..6ffa4d65eb 100644
--- a/web/tests/reactions.test.js
+++ b/web/tests/reactions.test.js
@@ -349,7 +349,7 @@ test("prevent_simultaneous_requests_updating_reaction", ({override, override_rew
 function stub_reactions(message_id) {
     const $message_row = $.create("message-row-stub");
     const $message_reactions = $.create("reactions-stub");
-    $(".message_table").set_find_results(`[zid='${CSS.escape(message_id)}']`, $message_row);
+    $(".message-list").set_find_results(`[zid='${CSS.escape(message_id)}']`, $message_row);
     $message_row.set_find_results(".message_reactions", $message_reactions);
     return $message_reactions;
 }