Tengo un escenario de tener una serie de botones de opción con el nombre del método de pago. Necesito cambiar ese texto al cargar la página. Por ejemplo.

<label class="radio-inline">
  <div class="iradio_square-blue">
    <input type="radio" name="paymentmethod" value="Paypal">
    <ins></ins>
  </div>
  Paypal India
</label>

En el ejemplo de código anterior, necesito cambiar "Paypal India" a "Paypal Global" a través de javascript. No tenemos una identificación para el botón de opción, la única forma de segmentar es a través de valor del botón de radio que en el caso anterior es paypal.

Puede alguien ayudarme aquí.

Gracias de antemano.

0
Vijay Patel 5 oct. 2021 a las 12:01

2 respuestas

La mejor respuesta

Deberá mirar los childNodes

const label = document.querySelector("[name=paymentmethod][value=Paypal]")
  .closest("label");
[...label.childNodes].forEach(node => {
  let text = node.textContent;
  if (text && text.includes("India")) {
    node.textContent = text.replace("India", "Global");
  }
});
<label class="radio-inline">
  <div class="iradio_square-blue">
    <input type="radio" name="paymentmethod" value="Paypal">
    <ins></ins>
  </div>
  Paypal India
</label>
0
mplungjan 5 oct. 2021 a las 09:09

Aquí para su referencia. Creo que te será de ayuda.

document.addEventListener("DOMContentLoaded", function(event) {
  const labels = document.getElementsByClassName('radio-inline');
  if (labels.length) {
    let label = labels[0];
    if (label.innerText === 'Paypal India') {    
      label.innerText = 'Paypal Global';
    }
  }
});
0
Soar Lin 5 oct. 2021 a las 09:14