There are two buttons, they may not have an href attribute, only events are hung. The color when you hover and click on any of them should change. But the pseudo-class: active in IE7 does not work for such cases, so a script was written that adds a class when the button is pressed and removes it when it is released. The problem is that my script only works for one button, but it is necessary for two. I tried to select a button class, but the script stops working altogether. Help edit the script so that when you click on the button with the 'btn' class, this button also adds the 'active' class. The script is needed on pure JS, in which I am not particularly strong. This is what is at the moment.
window.onload = function() { var btn = document.getElementById('continue'); btn.onmousedown = function() { this.className += " active"; } btn.onmouseup = function() { this.className = "btn"; } } .btn a { cursor: pointer; display: block; width: 247px; height: 44px; text-decoration: none; text-align: center; } .btn a span { line-height: 42px; font-size: 19px; color: #FFFFFF; } #continue a { background: #6E6E6E; } #continue a:hover { background: #8D8D8D; } #continue.active a, #continue a:active { background: #5E5E5E; } #buy { margin-top: 20px; } #buy a { background: #FEC600; } #buy a:hover { background: #FFDB5A; } #buy a:active { background: #FEB900; } #buy a span { color: #101010; } <!DOCTYPE html> <html> <head> <meta charset=utf-8 /> <title>JS Bin</title> </head> <body> <divclass="right-bottom"> <div class="btn" id="continue"> <a onclick="window.external.OnClose();"> <span>Continue converting</span> </a> </div> <div class="btn" id="buy"> <a href="" onclick="window.external.OnBuyNow(); return false;"> <span>Buy activation key</span> </a> </div> </div> </body> </html> 
