JSFiddle - React, Tailwind, and code Playground

HTML

<div class="menu-item">
    <div href="#" class="title closed">
        <font face="arial">Item 1</font>
        <span class="indicator">+</span>
    </div>
    <div class="content">
        <font face="arial">Grand Theft Auto TOM is een bekend Lady Gaga fan op GTAForum!</font>       
    </div>
</div>
<div class="menu-item">
    <div href="#" class="title closed">
        <font face="arial">Item 2</font>
        <span class="indicator">+</span>
    </div>
    <div class="content">
        <font face="arial">Maikle is een bekende hater op GTAForum!</font>
        <br />
        <img src="http://placekitten.com/200/225" alt="So cute :)" />
    </div>
</div>

CSS

.menu-item {
    position: relative;
    /* 70% for this demo */
    width: 70%;
    font-size: 14px;
}
.menu-item > .title {
    color: white;
    font-weight: bold;
    font-size: 16px;
    padding: 10px;
    cursor: pointer;
}

.menu-item > .open {
      background-color: #1E5384;      
}

.menu-item > .closed {
      background-color: #396c97;      
}

.menu-item .indicator {
    position: relative;
    float: right;
    padding-right: 15px;
}
.menu-item > .content {
    display: none;
    text-align: center;
}

JavaScript

$(document).ready(function(){

    $('.menu-item > .title').click(function(){
        var $content = $(this).parent().find('.content');
        var $indicator =  $(this).find('.indicator');
        var $title = $(this).parent().find('.title');
        var indicator;
        if($content.css('display') == 'block') {
            indicator = '+';
            $title.addClass('closed');
            $title.removeClass('open');
        } else {
            indicator = '-';
            $title.addClass('open');
            $title.removeClass('closed');
        }
        $indicator.text(indicator);
        $content.slideToggle("slow");
    });

});