JavaScript से वर्तमान एलिमेंट में एक्टिव क्लास जोड़ने के लिए, निम्न कोड का उपयोग करें:
उदाहरण
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1" /> <style> .btn { border: none; outline: none; padding: 10px 16px; background-color: #6ea2f0; cursor: pointer; color:white; font-size: 18px; } .active, .btn:hover { background-color: #666; color: white; } </style> </head> <body> <h1>Active Button Example</h1> <div id="sampleDiv"> <button class="btn">Giraffe</button> <button class="btn active">Cow</button> <button class="btn">Lion</button> <button class="btn">Leopard</button> <button class="btn">Cheetah</button> </div> <h2>Press any of the above button to set it class to active</h2> <script> var btns = document.querySelectorAll(".btn"); Array.from(btns).forEach(item => { item.addEventListener("click", () => { var selected = document.getElementsByClassName("active"); selected[0].className = selected[0].className.replace(" active", ""); item.className += " active"; }); }); </script> </body> </html>
आउटपुट
उपरोक्त कोड निम्न आउटपुट उत्पन्न करेगा:
किसी अन्य बटन पर क्लिक करने पर:
