JSFiddle - React, Tailwind, and code Playground

HTML

<a id="element1" onclick="toggle();" href="#">DETAY</a>
<div id="qwe" style="width:500px">
   metin<br/>
   metin<br/>
   metin<br/>
   metin<br/>
</div>

CSS

#qwe {
    border: 1px solid #000;
    height: 55px;
    background: yellow;
    overflow:hidden;
}

JavaScript

function toggle()
    {    
         var elm=document.getElementById('element1');
         var elem=document.getElementById("qwe");
         var kv = elem.style.width =="500px";
         if (kv) {
             elm.innerHTML = 'DETAY(kapat)'
             elem.style.width="800px";
        } 
        else {
           elm.innerHTML = 'DETAY'
           elem.style.width="500px";
        }
    }