Табы работоспособны, но не меняют и не реагируют на hash

src/blocks-demo.html

@@ -1882,16 +1882,16 @@
         </ul>
         <div class="tabs__content-wrapper">
           <div class="tabs__content-item  tabs__content-item--active" id="demo-tab-01" role="tabpanel">
-            <p>01 Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные.</p>
+            <p>01 Далеко-далеко.</p>
           </div>
           <div class="tabs__content-item" id="demo-tab-02" role="tabpanel">
-            <p>02 Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные.</p>
+            <p>02 Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные. Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные.</p>
           </div>
           <div class="tabs__content-item" id="demo-tab-03" role="tabpanel">
-            <p>03 Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные.</p>
+            <p>03 Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные. Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные. Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные.</p>
           </div>
           <div class="tabs__content-item" id="demo-tab-04" role="tabpanel">
-            <p>04 Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные.</p>
+            <p>04 Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные. Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные. Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные. Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные.</p>
           </div>
         </div>
       </div>

src/blocks/tabs/tabs.js

 document.addEventListener('DOMContentLoaded', function(){
 
-  // в процессе разработки
+  var tabsParentClassName = 'tabs';
+  var shownTabClassName = 'tabs__content-item--active';
 
   document.addEventListener('click', function(event) {
     if(event.target.dataset.toggle === 'tab') {
       event.preventDefault();
       var target = event.target.hash === undefined ? event.target.dataset.target : event.target.hash;
-      console.log( target );
+      // console.log( target );
       if ( target !== undefined ) {
-        console.log( document.querySelector(target) );
+        var tabsParent = document.querySelector(target).closest('.'+tabsParentClassName);
+        tabsParent.querySelectorAll('.'+shownTabClassName).forEach(function(item){
+          item.classList.remove(shownTabClassName);
+        });
+        tabsParent.querySelector(target).classList.add(shownTabClassName);
       }
     }
   });
 
+  // Добавление метода .closest() (полифил, собственно)
+  (function(e){
+   e.closest = e.closest || function(css){
+     var node = this;
+
+     while (node) {
+        if (node.matches(css)) return node;
+        else node = node.parentElement;
+     }
+     return null;
+   }
+  })(Element.prototype);
+
 });

src/blocks/tabs/tabs.scss

@@ -73,7 +73,16 @@ $field-padding-horizontal:    0.7em !default;
 
   &__content-item {
 
-    &--active {}
+    .js & {
+      display: none;
+    }
+
+    &--active {
+
+      .js & {
+        display: block;
+      }
+    }
   }
 }