diff --git a/core/modules/block_content/js/block_content.js b/core/modules/block_content/js/block_content.js
index 1c9cea2..5f58b91 100644
--- a/core/modules/block_content/js/block_content.js
+++ b/core/modules/block_content/js/block_content.js
@@ -15,13 +15,13 @@
       var $context = $(context);
       $context.find('.block-content-form-revision-information').drupalSetSummary(function (context) {
         var $revisionContext = $(context);
-        var revisionCheckbox = $revisionContext.find('.form-item-revision input');
+        var revisionCheckbox = $revisionContext.find('.js-form-item-revision input');
 
         // Return 'New revision' if the 'Create new revision' checkbox is checked,
         // or if the checkbox doesn't exist, but the revision log does. For users
         // without the "Administer content" permission the checkbox won't appear,
         // but the revision log will if the content type is set to auto-revision.
-        if (revisionCheckbox.is(':checked') || (!revisionCheckbox.length && $revisionContext.find('.form-item-revision-log textarea').length)) {
+        if (revisionCheckbox.is(':checked') || (!revisionCheckbox.length && $revisionContext.find('.js-form-item-revision-log textarea').length)) {
           return Drupal.t('New revision');
         }
 
@@ -31,13 +31,13 @@
       $context.find('fieldset.block-content-translation-options').drupalSetSummary(function (context) {
         var $translationContext = $(context);
         var translate;
-        var $checkbox = $translationContext.find('.form-item-translation-translate input');
+        var $checkbox = $translationContext.find('.js-form-item-translation-translate input');
 
         if ($checkbox.size()) {
           translate = $checkbox.is(':checked') ? Drupal.t('Needs to be updated') : Drupal.t('Does not need to be updated');
         }
         else {
-          $checkbox = $translationContext.find('.form-item-translation-retranslate input');
+          $checkbox = $translationContext.find('.js-form-item-translation-retranslate input');
           translate = $checkbox.is(':checked') ? Drupal.t('Flag other translations as outdated') : Drupal.t('Do not flag other translations as outdated');
         }
 
diff --git a/core/modules/ckeditor/js/ckeditor.admin.js b/core/modules/ckeditor/js/ckeditor.admin.js
index 24ebfb4..b53949e 100644
--- a/core/modules/ckeditor/js/ckeditor.admin.js
+++ b/core/modules/ckeditor/js/ckeditor.admin.js
@@ -20,7 +20,7 @@
         var $textarea = $configurationForm
           // Hide the textarea that contains the serialized representation of the
           // CKEditor configuration.
-          .find('.form-item-editor-settings-toolbar-button-groups')
+          .find('.js-form-item-editor-settings-toolbar-button-groups')
           .hide()
           // Return the textarea child node from this expression.
           .find('textarea');
diff --git a/core/modules/comment/comment-entity-form.js b/core/modules/comment/comment-entity-form.js
index 9e90979..3cdf08c 100644
--- a/core/modules/comment/comment-entity-form.js
+++ b/core/modules/comment/comment-entity-form.js
@@ -15,7 +15,7 @@
     attach: function (context) {
       var $context = $(context);
       $context.find('fieldset.comment-entity-settings-form').drupalSetSummary(function (context) {
-        return Drupal.checkPlain($(context).find('.form-item-comment input:checked').next('label').text());
+        return Drupal.checkPlain($(context).find('.js-form-item-comment input:checked').next('label').text());
       });
     }
   };
diff --git a/core/modules/field_ui/field_ui.js b/core/modules/field_ui/field_ui.js
index c15e4a0..4428ba0 100644
--- a/core/modules/field_ui/field_ui.js
+++ b/core/modules/field_ui/field_ui.js
@@ -22,9 +22,9 @@
         // and "re-use existing" can never be filled and submitted at the same
         // time. The actual validation will happen server-side.
         $form.find(
-          '.form-item-label label,' +
-          '.form-item-field-name label,' +
-          '.form-item-existing-storage-label label')
+          '.js-form-item-label label,' +
+          '.js-form-item-field-name label,' +
+          '.js-form-item-existing-storage-label label')
           .addClass('form-required');
 
         var $newFieldType = $form.find('select[name="new_storage_type"]');
diff --git a/core/modules/language/config/optional/tour.tour.language.yml b/core/modules/language/config/optional/tour.tour.language.yml
index 7cca3e5..ffc855d 100644
--- a/core/modules/language/config/optional/tour.tour.language.yml
+++ b/core/modules/language/config/optional/tour.tour.language.yml
@@ -34,7 +34,7 @@ tips:
     body: '<p>You can change the default language of the site by choosing one of your configured languages as default. The site will use the default language in situations where no choice is made but a language should be set, for example as the language of the displayed interface.</p>'
     weight: 4
     attributes:
-      data-class: form-item-site-default-language
+      data-class: js-form-item-site-default-language
   language-operations:
     id: language-operations
     plugin: text
diff --git a/core/modules/menu_ui/menu_ui.js b/core/modules/menu_ui/menu_ui.js
index 2103952..0409224 100644
--- a/core/modules/menu_ui/menu_ui.js
+++ b/core/modules/menu_ui/menu_ui.js
@@ -15,8 +15,8 @@
     attach: function (context) {
       $(context).find('.menu-link-form').drupalSetSummary(function (context) {
         var $context = $(context);
-        if ($context.find('.form-item-menu-enabled input').is(':checked')) {
-          return Drupal.checkPlain($context.find('.form-item-menu-title input').val());
+        if ($context.find('.js-form-item-menu-enabled input').is(':checked')) {
+          return Drupal.checkPlain($context.find('.js-form-item-menu-title input').val());
         }
         else {
           return Drupal.t('Not in menu');
@@ -37,9 +37,9 @@
         var $this = $(this);
         // Try to find menu settings widget elements as well as a 'title' field in
         // the form, but play nicely with user permissions and form alterations.
-        var $checkbox = $this.find('.form-item-menu-enabled input');
-        var $link_title = $context.find('.form-item-menu-title input');
-        var $title = $this.closest('form').find('.form-item-title-0-value input');
+        var $checkbox = $this.find('.js-form-item-menu-enabled input');
+        var $link_title = $context.find('.js-form-item-menu-title input');
+        var $title = $this.closest('form').find('.js-form-item-title-0-value input');
         // Bail out if we do not have all required fields.
         if (!($checkbox.length && $link_title.length && $title.length)) {
           return;
diff --git a/core/modules/node/content_types.js b/core/modules/node/content_types.js
index 77ab168..2d12bce 100644
--- a/core/modules/node/content_types.js
+++ b/core/modules/node/content_types.js
@@ -33,7 +33,7 @@
       $('#edit-language', context).drupalSetSummary(function (context) {
         var vals = [];
 
-        vals.push($(".form-item-language-configuration-langcode select option:selected", context).text());
+        vals.push($(".js-form-item-language-configuration-langcode select option:selected", context).text());
 
         $('input:checked', context).next('label').each(function () {
           vals.push(Drupal.checkPlain($(this).text()));
diff --git a/core/modules/node/node.js b/core/modules/node/node.js
index af2ed46..294b2a7 100644
--- a/core/modules/node/node.js
+++ b/core/modules/node/node.js
@@ -16,13 +16,13 @@
       var $context = $(context);
       $context.find('.node-form-revision-information').drupalSetSummary(function (context) {
         var $revisionContext = $(context);
-        var revisionCheckbox = $revisionContext.find('.form-item-revision input');
+        var revisionCheckbox = $revisionContext.find('.js-form-item-revision input');
 
         // Return 'New revision' if the 'Create new revision' checkbox is checked,
         // or if the checkbox doesn't exist, but the revision log does. For users
         // without the "Administer content" permission the checkbox won't appear,
         // but the revision log will if the content type is set to auto-revision.
-        if (revisionCheckbox.is(':checked') || (!revisionCheckbox.length && $revisionContext.find('.form-item-revision-log textarea').length)) {
+        if (revisionCheckbox.is(':checked') || (!revisionCheckbox.length && $revisionContext.find('.js-form-item-revision-log textarea').length)) {
           return Drupal.t('New revision');
         }
 
@@ -56,13 +56,13 @@
       $context.find('fieldset.node-translation-options').drupalSetSummary(function (context) {
         var $translationContext = $(context);
         var translate;
-        var $checkbox = $translationContext.find('.form-item-translation-translate input');
+        var $checkbox = $translationContext.find('.js-form-item-translation-translate input');
 
         if ($checkbox.size()) {
           translate = $checkbox.is(':checked') ? Drupal.t('Needs to be updated') : Drupal.t('Does not need to be updated');
         }
         else {
-          $checkbox = $translationContext.find('.form-item-translation-retranslate input');
+          $checkbox = $translationContext.find('.js-form-item-translation-retranslate input');
           translate = $checkbox.is(':checked') ? Drupal.t('Flag other translations as outdated') : Drupal.t('Do not flag other translations as outdated');
         }
 
diff --git a/core/modules/path/path.js b/core/modules/path/path.js
index 474cf87..60f828a 100644
--- a/core/modules/path/path.js
+++ b/core/modules/path/path.js
@@ -13,7 +13,7 @@
   Drupal.behaviors.pathDetailsSummaries = {
     attach: function (context) {
       $(context).find('.path-form').drupalSetSummary(function (context) {
-        var path = $('.form-item-path-0-alias input').val();
+        var path = $('.js-form-item-path-0-alias input').val();
 
         return path ?
           Drupal.t('Alias: @alias', {'@alias': path}) :
diff --git a/core/modules/system/src/Tests/Form/ElementsLabelsTest.php b/core/modules/system/src/Tests/Form/ElementsLabelsTest.php
index 9baf888..421cd3b 100644
--- a/core/modules/system/src/Tests/Form/ElementsLabelsTest.php
+++ b/core/modules/system/src/Tests/Form/ElementsLabelsTest.php
@@ -71,7 +71,7 @@ function testFormLabels() {
     $elements = $this->xpath('//label[@for="edit-form-textfield-test-title-no-show"]');
     $this->assertFalse(isset($elements[0]), 'No label tag when title set not to display.');
 
-    $elements = $this->xpath('//div[contains(@class, "form-item-form-textfield-test-title-invisible") and contains(@class, "form-no-label")]');
+    $elements = $this->xpath('//div[contains(@class, "js-form-item-form-textfield-test-title-invisible") and contains(@class, "form-no-label")]');
     $this->assertTrue(isset($elements[0]), 'Field class is form-no-label when there is no label.');
 
     // Check #field_prefix and #field_suffix placement.
@@ -82,10 +82,10 @@ function testFormLabels() {
     $this->assertTrue(isset($elements[0]), 'Properly places the #field_suffix element immediately after the form field.');
 
     // Check #prefix and #suffix placement.
-    $elements = $this->xpath('//div[@id="form-test-textfield-title-prefix"]/following-sibling::div[contains(@class, \'form-item-form-textfield-test-title\')]');
+    $elements = $this->xpath('//div[@id="form-test-textfield-title-prefix"]/following-sibling::div[contains(@class, \'js-form-item-form-textfield-test-title\')]');
     $this->assertTrue(isset($elements[0]), 'Properly places the #prefix element before the form item.');
 
-    $elements = $this->xpath('//div[@id="form-test-textfield-title-suffix"]/preceding-sibling::div[contains(@class, \'form-item-form-textfield-test-title\')]');
+    $elements = $this->xpath('//div[@id="form-test-textfield-title-suffix"]/preceding-sibling::div[contains(@class, \'js-form-item-form-textfield-test-title\')]');
     $this->assertTrue(isset($elements[0]), 'Properly places the #suffix element before the form item.');
 
     // Check title attribute for radios and checkboxes.
diff --git a/core/modules/system/src/Tests/Form/RebuildTest.php b/core/modules/system/src/Tests/Form/RebuildTest.php
index 9826070..3fc954a 100644
--- a/core/modules/system/src/Tests/Form/RebuildTest.php
+++ b/core/modules/system/src/Tests/Form/RebuildTest.php
@@ -109,7 +109,7 @@ function testPreserveFormActionAfterAJAX() {
 
     // Ensure that the form contains two items in the multi-valued field, so we
     // know we're testing a form that was correctly retrieved from cache.
-    $this->assert(count($this->xpath('//form[contains(@id, "node-page-form")]//div[contains(@class, "form-item-field-ajax-test")]//input[@type="text"]')) == 2, 'Form retained its state from cache.');
+    $this->assert(count($this->xpath('//form[contains(@id, "node-page-form")]//div[contains(@class, "js-form-item-field-ajax-test")]//input[@type="text"]')) == 2, 'Form retained its state from cache.');
 
     // Ensure that the form's action is correct.
     $forms = $this->xpath('//form[contains(@class, "node-page-form")]');
diff --git a/core/modules/system/src/Tests/System/ThemeTest.php b/core/modules/system/src/Tests/System/ThemeTest.php
index 7c85275..0508562 100644
--- a/core/modules/system/src/Tests/System/ThemeTest.php
+++ b/core/modules/system/src/Tests/System/ThemeTest.php
@@ -95,7 +95,7 @@ function testThemeSettings() {
 
       // Verify logo path examples.
       $elements = $this->xpath('//div[contains(@class, :item)]/div[@class=:description]/code', array(
-        ':item' => 'form-item-logo-path',
+        ':item' => 'js-form-item-logo-path',
         ':description' => 'description',
       ));
       // Expected default values (if all else fails).
diff --git a/core/modules/system/templates/form-element.html.twig b/core/modules/system/templates/form-element.html.twig
index 9292fd7..082df34 100644
--- a/core/modules/system/templates/form-element.html.twig
+++ b/core/modules/system/templates/form-element.html.twig
@@ -50,7 +50,8 @@
   set classes = [
     'form-item',
     'js-form-type-' ~ type|clean_class,
-    'form-item-' ~ name|clean_class,
+    'form-item' ~ name|clean_class,
+    'js-form-item-' ~ name|clean_class,
     title_display not in ['after', 'before'] ? 'form-no-label',
     disabled == 'disabled' ? 'form-disabled',
     errors ? 'form-item--error',
diff --git a/core/modules/views_ui/js/views-admin.js b/core/modules/views_ui/js/views-admin.js
index 539c406..aa64975 100644
--- a/core/modules/views_ui/js/views-admin.js
+++ b/core/modules/views_ui/js/views-admin.js
@@ -555,7 +555,7 @@
       }
       var $context = $(context);
       var $table = $context.find('#views-rearrange-filters').once('views-rearrange-filters');
-      var $operator = $context.find('.form-item-filter-groups-operator').once('views-rearrange-filters');
+      var $operator = $context.find('.js-form-item-filter-groups-operator').once('views-rearrange-filters');
       if ($table.length) {
         new Drupal.viewsUi.RearrangeFilterHandler($table, $operator);
       }
@@ -952,9 +952,9 @@
     attach: function (context) {
       var $context = $(context);
 
-      var $selectAll = $context.find('.form-item-options-value-all').once('filterConfigSelectAll');
+      var $selectAll = $context.find('.js-form-item-options-value-all').once('filterConfigSelectAll');
       var $selectAllCheckbox = $selectAll.find('input[type=checkbox]');
-      var $checkboxes = $selectAll.closest('.form-checkboxes').find('.js-form-type-checkbox:not(.form-item-options-value-all) input[type="checkbox"]');
+      var $checkboxes = $selectAll.closest('.form-checkboxes').find('.js-form-type-checkbox:not(.js-form-item-options-value-all) input[type="checkbox"]');
 
       if ($selectAll.length) {
          // Show the select all checkbox.
diff --git a/core/themes/classy/templates/form/form-element.html.twig b/core/themes/classy/templates/form/form-element.html.twig
index 65028fa..d33b094 100644
--- a/core/themes/classy/templates/form/form-element.html.twig
+++ b/core/themes/classy/templates/form/form-element.html.twig
@@ -49,6 +49,7 @@
     'form-item',
     'js-form-type-' ~ type|clean_class,
     'form-type-' ~ type|clean_class,
+    'js-form-item-' ~ name|clean_class,
     'form-item-' ~ name|clean_class,
     title_display not in ['after', 'before'] ? 'form-no-label',
     disabled == 'disabled' ? 'form-disabled',