JSFiddle - React, Tailwind, and code Playground

HTML

<div class="post">
    <div class="title">
        Title 1
    </div>
    <div class="entry">
        Text of post 1
    </div>
</div>
<div class="post">
    <div class="title">
        Title 2
    </div>
    <div class="entry">
        Text of post 2
    </div>
</div>
<div class="post">
    <div class="title">
        Title 3
    </div>
    <div class="entry">
        Text of post 3
    </div>
</div>

CSS

.title{
    background: #000000;
    color: #ffffff;
}

JavaScript

var Post = {
    init: function(el){
        this.el = el;
        this.title = el.children(".title");
        this.entry = el.children(".entry");
        var that = this;
        this.title.on("click", function(){
            that.hide();
        });
        
    },
    hide: function(){
        this.entry.slideUp('fast');
    },
    show: function(){
        this.entry.slideDown('fast');
    }
}
$(".post").each(function(){
    Post.init($(this));
})