JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.js"></script>
  <script src="https://cdn.rawgit.com/mrdoob/three.js/master/examples/js/controls/OrbitControls.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.7.1/gsap.min.js"></script>

JavaScript

const scene = new THREE.Scene();
const scene1 = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(
  75,
  window.innerWidth / window.innerHeight,
  0.1,
  1000
);
camera.position.z = 3;
const light = new THREE.AmbientLight(0x404040, 5);
scene.add(light);
const geometry = new THREE.BoxGeometry(1, 1, 0.1);
const material = new THREE.MeshBasicMaterial({ color: 0xff0 });
const cube = new THREE.Mesh(geometry, material);
cube.position.set(-0.5, 0, 0);
scene.add(cube);
const geometry1 = new THREE.BoxGeometry(1, 1, 0.1);
const material1 = new THREE.MeshBasicMaterial({ color: 0xff0000 });
const cube1 = new THREE.Mesh(geometry1, material1);
cube1.position.set(0.5, 0, 0);
scene.add(cube1);

const renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

var controls = new THREE.OrbitControls(camera, renderer.domElement);
const raycaster = new THREE.Raycaster();
const mouse = new THREE.Vector2();

renderer.autoClear = false;
window.addEventListener("mousedown", onMouseDown, false);
var clickCounter = 0;
function onMouseDown(event) {
  if (event.isPrimary === false) return;
  mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
  mouse.y = -(event.clientY / window.innerHeight) * 2 + 1;
  raycaster.setFromCamera(mouse, camera);
  const intersects = raycaster.intersectObjects([cube, cube1], true);

  if (intersects.length > 0) {
    clickCounter++;
    if (clickCounter % 2 == 1) {
      tween1 = gsap.to(cube.rotation, {
        duration: 1.5,
        y: "+=1.570795",
      });
     tween2 =  gsap.to(cube1.rotation, {
        duration: 1.5,
        y: "-=1.570795",
      });
    } else {
     tween1 =  gsap.to(cube.rotation, {
        duration: 1.5,
        y: "-=1.570795",
      });
     tween2 =  gsap.to(cube1.rotation, {
        duration: 1.5,
        y: "+=1.570795",
      });
    }
  }
}
const animate = function () {
  requestAnimationFrame(animate);
  renderer.render(scene,...