JSFiddle - React, Tailwind, and code Playground

by Alexandru Gatea

HTML

<link rel="stylesheet" href="https://assets-global.website-files.com/5be029bd327a5bbae24d1276/css/tnav.2ea074297.min.css">
<div class="tw-container scout-lp">
  <div class="tw-lp-grid">
    <div id="w-node-_64a1a9b3-e3d4-20ca-bbf9-903d8362e31c-653555e4" class="tw-lp-grid-item transition">
      <div class="tw-lp-grid-card">
        <div class="tw-lp-grid-card-visual"><img src="https://assets-global.website-files.com/5be029bd327a5bbae24d1276/63372f63ebc4d7f92df93c01_safe-animation.svg" loading="lazy" alt="" class="tw-lp-card-visual-image animated"><img src="https://assets-global.website-files.com/5be029bd327a5bbae24d1276/63372f637afdfc27dc08e9a6_safe-animation-stopped.svg" loading="lazy" alt="" class="tw-lp-card-visual-image">
          <div class="tw-lp-card-visual-icon w-embed"><svg width="74" height="74" viewBox="0 0 74 74" fill="none" xmlns="http://www.w3.org/2000/svg">
              <g clip-path="url(#clip0_8_3511)">
                <path d="M11.85 61.83C-1.95 48.03 -1.95 25.65 11.85 11.85C25.65 -1.95 48.03 -1.95 61.83 11.85C75.63 25.65 75.63 48.03 61.83 61.83" stroke="#7D77B2" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"></path>
                <path d="M19.7797 67.8C18.4697 67.08 17.1997 66.27 15.9697 65.37" stroke="#7D77B2" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"></path>
                <path d="M30.4304 71.6C28.7304 71.29 27.0504 70.85 25.4004 70.29" stroke="#7D77B2" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"></path>
                <path d="M43.0296 71.64C41.0696 71.99 39.0796 72.17 37.0996 72.18" stroke="#7D77B2" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"></path>
                <path d="M56.2902 66.36C54.1002 67.8 51.7902 68.98 49.4102 69.88" stroke="#7D77B2" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"></path>
                <path d="M36.8404 65.82C52.8456 65.82 65.8204 52.8452 65.8204 36.84C65.8204 20.8348 52.8456 7.85999 36.8404 7.85999C20.8351...

CSS

.tw-lp-question {
	overflow: hidden;
}

JavaScript

let question = document.getElementsByClassName("tw-lp-question");
	let que =  document.getElementsByClassName("tw-lp-q");
	let ans =  document.getElementsByClassName("tw-lp-a");
	
	Object.keys(question).forEach(key => {
		let a = question[key];
		let qH = a.querySelector(".tw-lp-q").offsetHeight;
		let aH = a.querySelector(".tw-lp-a").offsetHeight;
		
		a.style.height = qH + "px";
		
		a.addEventListener("click", function() {
			
			a.style.height = aH;
			
			
		});
	});