JSFiddle - React, Tailwind, and code Playground

HTML

<script type="text/ractive" id="template1">
    {{#each Posts}}
    <div style="background-color: red">{{Text}}</div>
    {{/each}}
    <button on-click="removeFirst">Remove first</button>
</script>

<main></main>

JavaScript

var ractive1 = new Ractive({
    template: '#template1',
    el: 'main',
    data: {
        Posts: [ {Text: "Pofdsgsdfasdfst 1"}, {Text: "adsfasdfPost 2"}, {Text: "Post 3"}, {Text: "Post 4"} ],    
    }
});

ractive1.on({
        removeFirst: function() {
            ractive1.splice('Posts', 0, 1);
        }
});