इसके लिए document.getElementByClassName() का इस्तेमाल करें। निम्नलिखित कोड है -
उदाहरण
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initialscale=1.0"> <title>Document</title> <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> </head> <body> <button class="clickTheButton">Click The Button to get an alert</button> <script> for (var clickButton of document.getElementsByClassName("clickTheButton")) clickButton.addEventListener("click", alertMeessage); function alertMeessage() { alert("You have clicked the button"); } </script> </body> </html>
उपरोक्त प्रोग्राम को चलाने के लिए, फ़ाइल नाम "anyName.html(index.html)" को सेव करें और फ़ाइल पर राइट क्लिक करें। वीएस कोड संपादक में "लाइव सर्वर के साथ खोलें" विकल्प चुनें।
आउटपुट
यह निम्नलिखित आउटपुट देगा -
जब आप बटन पर क्लिक करेंगे तो एक अलर्ट संदेश दिखाई देगा। यह निम्नलिखित आउटपुट उत्पन्न करेगा -