why isn't my Jekyll liquid "join" tag working properly?

Question

I have a simple Jekyll website on GitHub Pages to teach myself to code.

I am trying to do the following things:

1. pull a list of data elements from a data yaml file
2. List item as hyperlinks
3. join them with a bullet symbol • (doesnt matter, ive tried this with "and" and "," and I can't get any to work)

This is my code:

{% for item in site.data.footerlinks %}
<a href="{{ item.link }}">{{ item.name | join: "•" }}</a>
{% endfor %}

The output I desire is something like this:

image of output example of what I want to do

Answer 1

I've built off Nipul Prajapati's answer to give you something closer to your desired output screenshot:

{% for item in site.data.footerlinks %}
  <a href="{{ item.link }}">{{ item.name }}</a>{% unless forloop.last %} <span>•</span>{% endunless %}
{% endfor %}

Join is better used for data rather than presentation. As you already have the loop, its eaiser to add the symbol in the html. The unless tag stops this symbol from being applied for the last element. I regularly use this cheatsheet when I'm writing jekyll. Its helped me to quickly find the right functions and learn new ones too.

Its also possible to achieve this outcome by just using CSS pusedo elements, in case you want another challenge.