<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<button>1</button><button>2</button><button>3</button><button>4</button
><button>5</button><button>6</button><button>7</button><button>8</button
><button>9</button><button>10</button><button>11</button><button>12</button
><button>13</button><button>14</button><button>15</button><button>16</button
><button>17</button><button>18</button><button>19</button><button>20</button
><button>21</button><button>22</button><button>23</button><button>24</button
><button>25</button><button>26</button><button>27</button><button>28</button
><button>29</button><button>30</button><button>31</button><button>32</button
><button>33</button><button>34</button><button>35</button><button>36</button
><button>37</button><button>38</button><button>39</button><button>40</button
><button>41</button><button>42</button><button>43</button><button>44</button
><button>45</button><button>46</button><button>47</button><button>48</button
><button>49</button><button>50</button>
</body>
<script>
var buttons = document.querySelectorAll("button");
for (var k in buttons) {
buttons[k].onclick = function () {
var that = this;
setTimeout(function () {
that.style.background = "red";
}, 2000);
};
}
</script>
</html>
