<div x-data="{ groceries: ['Milk', 'Eggs', 'Cheese'] }">
    <p>Groceries</p>
    <ul>
        <template x-for="item in groceries">
            <li x-text="item"></li>
        </template>
    </ul>
</div>

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/alpinejs/2.8.0/alpine.js