JSFiddle - React, Tailwind, and code Playground

HTML

<section class="grid-container">
  <article>
    <div class="row clearfix">
      <div class="column half">
        <h2>Headline 1</h2>
      </div>
      <div class="column opposite half buttons">
        <a class="button-content1" href="#">Content 1</a>
        <a class="button-content2" href="#">Content 2</a>
      </div>
    </div>

    <div class="row clearfix">
      <div class="column full content1">
        <h1>Content 1</h1>
      </div>
    </div>

    <div class="row clearfix">
      <div class="column full content2">
        <h1>Content 2</h1>
      </div>
    </div>
  </article>


  <article>
    <div class="row clearfix">
      <div class="column half">
        <h2>Headline 2</h2>
      </div>
      <div class="column opposite half buttons">
        <a class="button-content1" href="#">Content 1</a>
        <a class="button-content2" href="#">Content 2</a>
      </div>
    </div>

    <div class="row clearfix">
      <div class="column full content1">
        <h1>Content 1</h1>
      </div>
    </div>

    <div class="row clearfix">
      <div class="column full content2">
        <h1>Content 2</h1>
      </div>
    </div>
  </article>
</section>

CSS

a {
  display: block;
  width: 70px;
  margin: 0 0 10px;
}

.grid-container {
  width: 520px;
}

.row {
  border: 1px solid #000;
  background-color: green;
}

.column {
  float: left;
}

.opposite {
  float: right;
}

.column.full {
  width: 100%;
}

.column.half {
  width: 50%;
}

.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }

JavaScript

var class_link, class_div, content_div;
  var all_panels = $('article > div.row').not(':first-child');

  $(all_panels).hide();

  $('div.buttons a').click(function() {
    class_link = $(this).attr('class');
    class_div = class_link.match(/[^-]+$/);
    content_div = $(this).closest('article').find('div.' + class_div).parent();

    if ($(content_div).is(':visible')) {
      $(all_panels).slideUp();
    } else {
      $(all_panels).slideUp(function() {
        $(content_div).hide().slideDown();
      });
    }

    return false;
  });