Estoy haciendo una función de cambio de color para mi proyecto. Este es mi html: click para verlo
Como título, quiero crear algunas etiquetas que tengan la misma clase como esta: <a class="dropdown-item" onclick...></a>
Y cada vez que un usuario haga clic en una de esas etiquetas, esa etiqueta en la que el usuario hizo clic tendrá un texto adicional [current]
como este: Sky [current]
. Pero cuando se hace clic en otra etiqueta , el texto [current]
se moverá a la nueva etiqueta (con la misma clase) en la que el usuario acaba de hacer clic.
Un enfoque simple es simplemente eliminar el texto adicional de cada elemento en el que se puede hacer clic y luego agregarlo al que se hizo clic.
Aquí hay un ejemplo.
function addText(event) { for (anchorTag of document.getElementsByClassName("myButton")){ anchorTag.innerHTML = anchorTag.innerHTML.replace(" Grape", ""); } event.target.innerHTML = event.target.innerHTML + " Grape"; }
<a href="#" class="myButton" onclick="addText(event)">Apple</a> <br/> <a href="#" class="myButton" onclick="addText(event)">Orange</a>