JSFiddle - React, Tailwind, and code Playground

by Bahman ParsaManesh

HTML

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <!-- Compiled and minified CSS -->
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.2/css/materialize.min.css">

    <!-- Compiled and minified JavaScript -->
</head>
<body>
  <a id='btndropdown1' class='dropdown-trigger' href="#" data-target='dropdown1'>
  <div class="col s2 m3">
    <div class="card red darken-1">
      <div class="card-content white-text">
        <span class="card-title center">Heizen</span>
      </div>
      <div class="center">
        <i class="material-icons large white-text">hot_tub</i>
      </div>
    </div>
  </div>
</a>
<ul id='dropdown1' class='dropdown-content red darken-1'>
        <li ><a href="#!" class="black-text">Heizgeräte</a></li>
        <li class="divider" tabindex="-1"></li>
        <li><a href="#!" class="black-text">Ex-Heizgeräte</a></li>
        <li class="divider" tabindex="-1"></li>
        <li><a href="#!" class="black-text">Heizgebläse</a></li>
      </ul>
<a  id='btndropdown2' class='dropdown-trigger' href="#" data-target='dropdown2'>
  <div class="col s2 m2">
    <div class="card cyan darken-1">
      <div class="card-content white-text">
        <span class="card-title center">Filterlüfter</span>
      </div>
      <div class="center">
        <i class="material-icons large white-text">view_headline</i>
      </div>
    </div>
  </div>
</a>
<ul id='dropdown2' class='dropdown-content cyan'>
        <li ><a href="#!" class="black-text">Filterlüfter</a></li>
        <li class="divider" tabindex="-1"></li>
        <li><a href="#!" class="black-text">Outdoor-Filterlüfter</a></li>
        <li class="divider" tabindex="-1"></li>
        <li><a href="#!" class="black-text">Dach-Filterlüfter</a></li>
        <li class="divider" tabindex="-1"></li>
        <li><a href="#!"...

JavaScript

$(document).ready(function(){
    $('#btndropdown1').dropdown();
    $('#btndropdown2').dropdown(); 
    /* $('.dropdown-trigger').dropdown() */
  });