Custom coded ticket sales-status

Hello! Working on a site which has an API from a ticket system populate the Webflow CMS with events.

One of the things it populates the CMS with is “salesStatus” which is either “0”, “1” or “2”.

I want to display this in a collection list over events users can buy tickets to, but I want it to be “translated” to text in a paragraph given the class "event-status.

The different states are as follows:
1 = Tickets available
2 = Sold out
3 = Few tickets remaining

I tried this but cant seem to get it working. Any ideas?

Screenshot 2021-02-16 at 15.57.53|690x289

Is this code embed in the collection list or collection page? I’m guessing a collection list because the collection page will inject only one instance of SaleStatus.

What if you don’t use the code embed and instead add the code before the body tag? I’m thinking maybe your javascript executes before Webflow serves the content from the collection list.

So you’d add a regular text element inside the collection list and connect it to the SalesStatus. These will load all your 0,2,3 status codes. Then use the code to override them after the load.

Probably you’d replace the CMS SaleStatus field in the code with x[i].textContent.