JSFiddle - React, Tailwind, and code Playground

HTML

<p>123312
  <div class="q1"></div>

CSS

.q1 {
  height: 300px;
  width: 100px;
  background: black;
  display: none;
}
p {
  float: right;
  background: red;
}

JavaScript

$('p').click(function() {
  if ($('.q1').is(':hidden')) {
    $('.q1').stop().slideToggle(function() {
      $('p').css({
        background: 'black'
      });
    });
  } else {
    $('.q1').stop().slideToggle(function() {
      $('p').css({
        background: 'red'
      });
    });
  }
});