JSFiddle - React, Tailwind, and code Playground

HTML

<div class="sector1">

  <h2>Sector 1</h2>

  <div class="js-pushdown1">
    <button class="js-pushdown-btn" data-panel="panel1">Panel 1</button>
    <div id="panel1" class="js-pushdown-panel">This is panel 1</div>
  </div>

  <div class="js-pushdown2">
    <button class="js-pushdown-btn" data-panel="panel2">Panel 2</button>
    <div id="panel2" class="js-pushdown-panel">This is panel 2</div>
  </div>

</div>

<div class="sector1">

  <h2>Sector 2</h2>

  <div class="js-pushdown1">
    <button class="js-pushdown-btn" data-panel="panel3">Panel 3</button>
    <div id="panel3" class="js-pushdown-panel">This is panel 3</div>
  </div>

  <div class="js-pushdown2">
    <button class="js-pushdown-btn" data-panel="panel4">Panel 4</button>
    <div id="panel4" class="js-pushdown-panel">This is panel 4</div>
  </div>

</div>

CSS

.js-pushdown-panel {
  display: none;
}

.js-pushdown-panel.is-active {
  display: block;
}

JavaScript

(function() {

  return PushdownProto = {
    init: function(elem) {
      this.element = $(elem);
      this.btn = this.element.find('.js-pushdown-btn');
      this.bindEvents();
    },
    open: function open() {
      var panel = this.btn.data('panel');
      this.btn.addClass('is-active');
      $('#' + panel).addClass('is-active');
    },
    close: function close() {
      var panel = this.btn.data('panel');
      this.btn.removeClass('is-active');
      $('#' + panel).removeClass('is-active');
    },
    toggle: function toggle(e) {
      console.log(e);
      if ($(e.target).hasClass('is-active')) {
        this.close();
      } else {
        this.open();
      }
    },
    bindEvents: function bindEvents() {
      var self = this;
      this.element.find('.js-pushdown-btn').on('click', $.proxy(self.toggle, this));
    }
  };

})();

(function() {

  return PickerProto = {
    init: function init(sector) {

      var origin = sector + ' .js-pushdown1';
      var destination = sector + ' .js-pushdown2';

      Pushdown1 = Object.create(PushdownProto);
      Pushdown1.init(origin);

      Pushdown2 = Object.create(PushdownProto);
      Pushdown2.init(destination);

    }
  }

})();

(function() {

  var SectorPicker1 = Object.create(PickerProto);
  SectorPicker1.init('.sector1');

  var SectorPicker2 = Object.create(PickerProto);
  SectorPicker2.init('.sector2');

})();