diff --git a/app/javascript/src/javascripts/artist_commentaries.js b/app/javascript/src/javascripts/artist_commentaries.js
index 6842f687b..06944a5a5 100644
--- a/app/javascript/src/javascripts/artist_commentaries.js
+++ b/app/javascript/src/javascripts/artist_commentaries.js
@@ -116,8 +116,8 @@ ArtistCommentary.fill_commentary = function(commentary) {
 // If the new description conflicts with the current description, merge them
 // by appending the new description onto the old one.
 ArtistCommentary.merge_commentaries = function(description, commentary) {
-  var post_source = $('#image-container').data().source;
-  var normalized_source = $("#image-container").data().normalizedSource;
+  var post_source = $('.image-container').data().source;
+  var normalized_source = $(".image-container").data().normalizedSource;
 
   if ((commentary.original_description && description) &&
       (commentary.original_description !== description)) {
diff --git a/app/javascript/src/javascripts/blacklists.js b/app/javascript/src/javascripts/blacklists.js
index 93ea14227..61a7df8dc 100644
--- a/app/javascript/src/javascripts/blacklists.js
+++ b/app/javascript/src/javascripts/blacklists.js
@@ -159,7 +159,7 @@ Blacklist.apply_post = function(post) {
 };
 
 Blacklist.posts = function() {
-  return $(".post-preview, #image-container, #c-comments .post, .mod-queue-preview.post-preview");
+  return $(".post-preview, .image-container, #c-comments .post, .mod-queue-preview.post-preview");
 }
 
 Blacklist.post_match = function(post, entry) {
diff --git a/app/javascript/src/javascripts/notes.js b/app/javascript/src/javascripts/notes.js
index 3b2bcec48..05ddb56af 100644
--- a/app/javascript/src/javascripts/notes.js
+++ b/app/javascript/src/javascripts/notes.js
@@ -190,7 +190,7 @@ let Note = {
     },
 
     find: function(id) {
-      return $("#note-container div.note-box[data-id=" + id + "]");
+      return $(".note-container div.note-box[data-id=" + id + "]");
     },
 
     drag_stop: function(event) {
@@ -409,7 +409,7 @@ let Note = {
     },
 
     scale_all: function() {
-      const $container = $('#note-container');
+      const $container = $('.note-container');
       if ($container.length === 0) {
         return;
       }
@@ -425,7 +425,7 @@ let Note = {
     },
 
     toggle_all: function() {
-      var $note_container = $("#note-container");
+      var $note_container = $(".note-container");
       var is_hidden = ($note_container.css('visibility') === 'hidden');
 
       if (is_hidden) {
@@ -493,7 +493,7 @@ let Note = {
     },
 
     find: function(id) {
-      return $("#note-container div.note-body[data-id=" + id + "]");
+      return $(".note-container div.note-body[data-id=" + id + "]");
     },
 
     hide: function(id) {
@@ -502,7 +502,7 @@ let Note = {
     },
 
     hide_all: function() {
-      $("#note-container div.note-body").hide();
+      $(".note-container div.note-body").hide();
     },
 
     resize: function($note_body) {
@@ -854,7 +854,7 @@ let Note = {
         Note.create(x - offset.left, y - offset.top, w, h);
       }
 
-      $("#note-container").css('visibility', 'visible');
+      $(".note-container").css('visibility', 'visible');
       e.stopPropagation();
       e.preventDefault();
     },
@@ -994,8 +994,8 @@ let Note = {
     Note.Box.update_data_attributes($note_box);
     $note_box.addClass("unsaved");
     $note_body.html("<em>Click to edit</em>");
-    $("#note-container").append($note_box);
-    $("#note-container").append($note_body);
+    $(".note-container").append($note_box);
+    $(".note-container").append($note_body);
     Note.id += "x";
   },
 
@@ -1039,7 +1039,7 @@ let Note = {
         $article.html()
       );
     });
-    const $note_container = $("#note-container");
+    const $note_container = $(".note-container");
     $note_container.append(fragment);
     if (Note.embed) {
       Note.base_font_size = parseFloat(window.getComputedStyle($note_container[0]).fontSize);
diff --git a/app/javascript/src/javascripts/posts.js.erb b/app/javascript/src/javascripts/posts.js.erb
index 400c10b1d..2a70b8be5 100644
--- a/app/javascript/src/javascripts/posts.js.erb
+++ b/app/javascript/src/javascripts/posts.js.erb
@@ -61,7 +61,7 @@ Post.initialize_gestures = function() {
   if (!Utility.test_max_width(660)) {
     return;
   }
-  $("#image-container").css({overflow: "visible"});
+  $(".image-container").css({overflow: "visible"});
   var hasPrev = $(".paginator a[rel~=prev]").length;
   var hasNext = $(".paginator a[rel~=next]").length;
 
@@ -332,7 +332,7 @@ Post.view_large = function(e) {
 
   var $image = $("#image");
   var $notice = $("#image-resize-notice");
-  $image.attr("src", $("#image-container").data("large-file-url"));
+  $image.attr("src", $(".image-container").data("large-file-url"));
   $image.css("filter", "blur(8px)");
   $image.width($image.data("large-width"));
   $image.height($image.data("large-height"));
@@ -423,7 +423,7 @@ Post.initialize_ugoira_player = function() {
   if ($("#ugoira-controls").length) {
     let content_type = $("#image").data("ugoira-content-type");
     let frames = $("#image").data("ugoira-frames");
-    let file_url = $("#image-container").data("file-url");
+    let file_url = $(".image-container").data("file-url");
 
     Ugoira.create_player(content_type, frames, file_url);
     $(window).on("resize.danbooru.ugoira_scale", Post.resize_ugoira_controls);
diff --git a/app/javascript/src/styles/common/blacklists.scss b/app/javascript/src/styles/common/blacklists.scss
index b025546c3..59d66967a 100644
--- a/app/javascript/src/styles/common/blacklists.scss
+++ b/app/javascript/src/styles/common/blacklists.scss
@@ -40,6 +40,6 @@
   }
 }
 
-.post-preview.blacklisted-active, #image-container.blacklisted-active, #c-comments .post.blacklisted-active {
+.post-preview.blacklisted-active, .image-container.blacklisted-active, #c-comments .post.blacklisted-active {
   display: none !important;
 }
diff --git a/app/javascript/src/styles/specific/notes.scss b/app/javascript/src/styles/specific/notes.scss
index 21cb892a8..240c0c0fa 100644
--- a/app/javascript/src/styles/specific/notes.scss
+++ b/app/javascript/src/styles/specific/notes.scss
@@ -1,4 +1,4 @@
-div#note-container {
+.note-container {
   position: absolute;
 
   div.note-body {
diff --git a/app/javascript/src/styles/specific/posts.scss b/app/javascript/src/styles/specific/posts.scss
index e9de9b0ea..2e6037235 100644
--- a/app/javascript/src/styles/specific/posts.scss
+++ b/app/javascript/src/styles/specific/posts.scss
@@ -337,7 +337,7 @@ div#c-posts {
       }
     }
 
-    #image-container {
+    .image-container {
       margin: 1em 0 0.5em;
     }
 
diff --git a/app/views/posts/show.html.erb b/app/views/posts/show.html.erb
index 6fd74ebf9..b945ef7f8 100644
--- a/app/views/posts/show.html.erb
+++ b/app/views/posts/show.html.erb
@@ -50,8 +50,8 @@
 
   <%= render "posts/partials/show/notices", :post => @post %>
 
-  <%= content_tag(:section, { id: "image-container" }.merge(PostPresenter.data_attributes(@post))) do -%>
-    <div id="note-container"></div>
+  <%= content_tag(:section, { class: "image-container" }.merge(PostPresenter.data_attributes(@post))) do -%>
+    <div class="note-container"></div>
     <div id="note-preview"></div>
     <%= render "posts/partials/show/embedded", post: @post %>
   <% end -%>