I am using the each block similar to the code below. I have an array of items that is iterated through and then a button is create for all of the items.
<ul>
{#each cats as { id, name }, i}
<li><button target="_blank" href="https://www.youtube.com/watch?v={id}">
{i + 1}: {name}
</button></li>
{/each}
</ul>
But I would like to stylize the buttons uniquely. For example I want the first button to be red and square, the next to be yellow and round, and the last normal. How would I go about adding that to the example above?