diff --git a/static/js/click_handlers.js b/static/js/click_handlers.js
index 55aa0bb4ae..e5c9d99f9d 100644
--- a/static/js/click_handlers.js
+++ b/static/js/click_handlers.js
@@ -671,7 +671,7 @@ export function initialize() {
 
     function handle_compose_click(e) {
         // Emoji clicks should be handled by their own click handler in emoji_picker.js
-        if ($(e.target).is("#emoji_map, img.emoji, .drag, .compose_giphy_logo")) {
+        if ($(e.target).is(".emoji_map, img.emoji, .drag, .compose_giphy_logo")) {
             return;
         }
 
diff --git a/static/js/emoji_picker.js b/static/js/emoji_picker.js
index e2288b56dd..0e67688ff5 100644
--- a/static/js/emoji_picker.js
+++ b/static/js/emoji_picker.js
@@ -700,7 +700,7 @@ export function register_click_handlers() {
         hide_emoji_popover();
     });
 
-    $("body").on("click", "#emoji_map", function (e) {
+    $("body").on("click", ".emoji_map", function (e) {
         e.preventDefault();
         e.stopPropagation();
         // The data-message-id attribute is only present in the emoji icon present in
diff --git a/static/templates/compose_control_buttons.hbs b/static/templates/compose_control_buttons.hbs
index 363f9123c9..53ede8c96c 100644
--- a/static/templates/compose_control_buttons.hbs
+++ b/static/templates/compose_control_buttons.hbs
@@ -5,7 +5,7 @@
 <a role="button" class="markdown_preview compose_control_button fa fa-eye" aria-label="{{t 'Preview' }}" tabindex=0 title="{{t 'Preview' }}"></a>
 <a role="button" class="undo_markdown_preview compose_control_button fa fa-edit" aria-label="{{t 'Write' }}" tabindex=0 style="display:none;" title="{{t 'Write' }}"></a>
 <a role="button" class="compose_control_button fa fa-video-camera video_link" aria-label="{{t 'Add video call' }}" tabindex=0 title="{{t 'Add video call' }}"></a>
-<a role="button" class="compose_control_button fa fa-smile-o" aria-label="{{t 'Add emoji' }}" id="emoji_map" tabindex=0 title="{{t 'Add emoji' }}"></a>
+<a role="button" class="compose_control_button fa fa-smile-o emoji_map" aria-label="{{t 'Add emoji' }}" tabindex=0 title="{{t 'Add emoji' }}"></a>
 {{#if giphy_api_available }}
 <a role="button" class="compose_control_button" aria-label="{{t 'Add GIF' }}" id="compose_box_giphy_grid" title="{{t 'Add GIF' }}">
     <img class="compose_giphy_logo" tabindex=0 src="/static/images/GIPHY_logo.png" />
diff --git a/static/templates/message_edit_form.hbs b/static/templates/message_edit_form.hbs
index 47962b30db..d373461fdf 100644
--- a/static/templates/message_edit_form.hbs
+++ b/static/templates/message_edit_form.hbs
@@ -67,7 +67,7 @@
                     {{#if show_video_chat_button}}
                     <a role="button" tabindex=0 class="compose_control_button fa fa-video-camera video_link" aria-label="{{t "Add video call" }}" title="{{t "Add video call" }}"></a>
                     {{/if}}
-                    <a role="button" tabindex=0 class="compose_control_button fa fa-smile-o" aria-label="{{t 'Add emoji' }}" id="emoji_map" data-message-id="{{message_id}}" title="{{t 'Add emoji' }}"></a>
+                    <a role="button" tabindex=0 class="emoji_map compose_control_button fa fa-smile-o" aria-label="{{t 'Add emoji' }}" data-message-id="{{message_id}}" title="{{t 'Add emoji' }}"></a>
                     {{#if giphy_api_available }}
                     <a role="button" class="compose_control_button" aria-label="{{t 'Add GIF' }}" id="compose_box_giphy_grid" title="{{t 'Add GIF' }}">
                         <img class="compose_giphy_logo" tabindex=0 src="/static/images/GIPHY_logo.png" data-message-id="{{message_id}}" />