Estoy creando un juego de Simon, pero necesito obtener el valor "id" (atributo). pero cada vez que hago clic en el color diferente, todavía me da el primer valor de atributo, que en este caso es verde. cuantas veces hago clic en el boton rojo, azul o amarillo pero me sigue dando valor verde (el primero). ¡ayuda por favor!
//Debajo del código HTML
<div class="container"> <button class="btn green" id="green"></button> <button class="btn red" id="red"></button><br /> <button class="btn yellow" id="yellow"></button> <button class="btn blue" id="blue"></button> </div>//Debajo del código Jquery
$(".btn").click(function () { var userChosenColor =$(".btn").attr("id"); console.log(userChosenColor); });Referencia al botón en el que se hizo clic. No necesariamente necesita jQuery para esto.
$(".btn").click(function () { var userChosenColor = $(this).attr("id"); console.log('jQuery: '+ userChosenColor); }); /* non jQuery */ const btns = document.querySelectorAll('.btn'); btns.forEach(btn=> { btn.addEventListener('click', () => { console.log('JS only: '+btn.id) }); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="container"> <button class="btn green" id="green">1</button> <button class="btn red" id="red">2</button><br /> <button class="btn yellow" id="yellow">3</button> <button class="btn blue" id="blue">4</button> </div>