JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/css/materialize.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/js/materialize.min.js"></script>
<div class="row">
  <div class="col s12">
    <ul class="tabs">
      <li class="tab col s4"><a class="active" href="#test1">Tab1</a></li>
      <li class="tab col s4"><a href="#test2">Tab2</a></li>
      <li class="tab col s4"><a href="#test3">Tab3</a></li>
    </ul>
  </div>
  <ul class="tabs-content">
    <li id="test1" class="col s12">Test 1</li>
    <li id="test2" class="col s12">Test 2</li>
    <li id="test3" class="col s12">Test 3</li>
  </ul>
</div>

CSS

.tabs-content>li {
  opacity: 0;
}

JavaScript

Materialize.showStaggeredList('.tabs-content');
$('.tabs > li').on('click', function() {
  Materialize.showStaggeredList('.tabs-content');
});