JSFiddle - React, Tailwind, and code Playground

HTML

<div id='arrow' data-angle="45">

</div>

CSS

div {
  border: 20px solid black;
  border-right-color: transparent;
  border-bottom-color: transparent;
  transform: rotate(45deg);
  display: inline-block;
  width: 30px;
  height: 30px;
  margin-top: 40px;
  margin-left: 40px;
  transition: 200ms transform;
}

JavaScript

const ar = document.querySelector('#arrow')

ar.onclick = () => {
  const angle = +ar.dataset.angle
  ar.dataset.angle = angle + 180
  ar.style.transform = `rotate(${angle + 180}deg)`
}