Question 3006 in Woocommerce Question posted in
The official Woocommerce documentation can be found here.

How to add text to existing li in javascript – Woocommerce

In the below code you cant add any new ids or class names.
If the user clicks the button then if the errorUL exists then I want to add a message to the existing li or create a new li and add the message. Either way I want to show the extra message. "The card has been declined for an unknown reason. Please contact support".

 <button id = 'place_order'>button</button>
    <ul class="woocommerce-error" role="alert">
                <li>
                The card has been declined for an unknown reason.</li>
        </ul>
    
    <Script>document.getElementById('place_order').onclick = function() {
       var errorUl = document.getElementsByClassName('woocommerce-error');
       if(errorUl.length > 0) {
        {{NEED to access the li and add a message}}
       }
    }</Script>
Tags:

2

Answers


  1. 0

    You change the elements text like this:

    let li = document.querySelector('.woocommerce-error li')
li.innerHTML = li.innerHTML + //Your text
    Login or Signup to reply.
  2. 0

    This is the answer

    document.getElementById('place_order').onclick = function() {
       var errorUl = document.getElementsByClassName('woocommerce-error');
       if(errorUl.length > 0) {
        const list = document.getElementById("error_li");
        list.innerText = "changed"
       }
}
     <button id = 'place_order'>button</button>
 <ul class="woocommerce-error" role="alert">
 <li id="error_li">The card has been declined for an unknown reason.</li></ul>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search