0

Hola amigos estoy tratando cambiar la el nombre de la clase de 2 < li>

ambas etiquetas contienen el mismo nombre de la clase give-icon give-icon-question necesito remover give-icon-question y agregar fas fa-credit-card a un li y al otro fas fa-credit-card

con esta idea deberia quedar asi

introducir la descripción de la imagen aquí el número de asignación es 4 y 5 ya que el formulario contiene otros input

var element = document.getElementsByClassName('give-icon', 'give-icon-question')[4].classList;
element.remove('give-icon', 'give-icon-question');
element.add('fas', 'fa-credit-card');

var element1 = document.getElementsByClassName('give-icon', 'give-icon-question')[5].classList;
element1.remove('give-icon', 'give-icon-question');
element1.add('fas', 'fa-calendar');
<fieldset id="give-ffm-section" data-fields="numero_de_tarjeta|vencimiento">

    <div id="numero_de_tarjeta-wrap">       
        <input class="textfield required" id="ffm-numero_de_tarjeta" type="text" data-required="yes" data-type="text" required="required" name="numero_de_tarjeta" placeholder="Tarjeta: xxxx xxxx xxxx xxxx" value="0000 0000 0000 0000" maxlength="19" tabindex="1">  
        <div class="give-tooltip-wrap">
        <span class="give-tooltip hint--top" data-tooltip="n.º de tarjeta: xxxx xxxx xxxx xxxx" aria-label="n.º de tarjeta: xxxx xxxx xxxx xxxx">
        <i class="**give-icon give-icon-question**"></i>
        </span>
        </div>
        </div>
        
        <div id="vencimiento-wrap">     
        <input id="ffm-vencimiento" type="text" data-dateformat="mm/yy" data-timeformat="h:mm tt" class="give-ffm-date give-ffm-timepicker give-ffm-datepicker-vencimiento" data-required="yes" data-type="text" required="required" placeholder="Vencimiento" name="vencimiento" value="" size="30" tabindex="1">
        <div class="give-tooltip-wrap">
        <span class="give-tooltip hint--top" data-tooltip="2/2023" aria-label="2/2023">
        <i class="**give-icon give-icon-question**"></i>
        </span>
        </div>
        </div>
</fieldset>

cuando ejecuto en la consola del navegador

var element = document.getElementsByClassName('give-icon', 'give-icon-question')[4].classList;
element.remove('give-icon', 'give-icon-question');
element.add('fas', 'fa-credit-card');

realiza el proceso, pero cuando agrego el fragmento directamente en el archivo del formulario no funciona correctamente

1 respuesta 1

0

Intente de la siguiente forma realiza el cambio desde la consola, recorre la pagina con un for en busca de la clase give-icon-question , cuando agrego directamente el codigo el en archivo del formulario no se ejecuta como debería

var fas = document.getElementsByClassName("give-icon-question");
for (var i = 0; i<fas.length; i++) {
   fas[i].classList.remove("give-icon-question");
   fas[i].classList.add('fas','fa-credit-card');
}
<span class="give-tooltip hint--top" data-tooltip="n.º de tarjeta: xxxx xxxx xxxx xxxx" aria-label="n.º de tarjeta: xxxx xxxx xxxx xxxx">
<i class="give-icon give-icon-question"></i>
</span>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.