Javascript not working after first element

JavaScript
1

I found some new countdown timer code and it’s working and has the data suffix in it but noticed it only worked on the first element and after some Googling I found it only worked on the first span tag with the id called delivery-text and that using class is better so I changed the lines below but it’s not working at all now

From

<span id="delivery-text">Super fast delivery available</span>

To

<div class="delivery-text">Super fast delivery available</div>

From

const deliveryText = document.getElementById('delivery-text');

To

const deliveryText = document.getElementsByClassName('.delivery-text');

I also tried the line below but that didn’r work eother

const deliveryText = document.querySelectorAll('.delivery-text');
2

the class name doesnt have a . in it. (the . is a CSS selector, but getElementsByClassName already is looking at the class value, so you’d just put "delivery-text" in there.
that said,

should work also, but keep in mind that both getElementsByClassName and querySelectorAll will return an array of results, not a singular result.

3

I updated the line of code to the following but it’s still not working

const deliveryText = document.getElementsByClassName("delivery-text");
4

What are you doing with deliveryText that makes you think its not working?

5

I copied the code from https://medium.com/@tristannothling/how-to-add-an-amazon-style-delivery-countdown-to-your-shopify-or-e-commerce-store-without-using-4eb117165da2 and just followed what it said but on https://shop.it-doneright.co.uk/Laptops it’s not working, it should display a timer countdown where it says Super fast delivery available

6

okay…you cant take an array and do .textContent on it. An array doesnt have a textContent method. You would need to foreach the array, or else use jquery (cause i can see you’ve got that loaded) instead.

I’d suggest you look up foreaching, the jquery equivalent would be to $(“.delivery-text”).text(yourtext)

7

I’ll see what I can do as not great at javascript so not 100% sure how it would go, could you provide sample code please or code that could get it working, sorry to ask

8

For example:

const deliveryText = document.getElementsByClassName('delivery-text');

for(let i = 0; i < deliveryText.length; ++i) {
    deliveryText[i].innerText = 'Countdown here... ' + (i + 1);
}

image
image1772×1517 342 KB

9

Thank you, I’ll see what I can do

Where it’s got countdown here, do I put the countdown code there that does the timer part?

10

I’m really stuck on this, I don’t know what I’m doing to be honest and how to fix it, I’ll have to ask around and if any developers can fix it for me

11

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.