JSFiddle - React, Tailwind, and code Playground

by oceog

HTML

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js?ver=1.7.2"></script>
<script type="text/javascript" src="http://likbezz.ru/_fr/3/1844975.js"></script>
<div id="exContent" style="text-align:left;padding-top:50px;">
    <div class="hideWrap">
<a class="hideBtn" href="javascript://" title="Показать\Скрыть блок">Показать</a>

        <div
        class="hideCont">Здесь располагается содержимое class "hideCont"</div>
</div>
<br />
<br />
<div class="hideWrap">
<a class="hideBtn" href="javascript://" title="Показать\Скрыть блок">Показать</a>

</div>
<br />
<br />
<div class="hideWrap">
<a class="hideBtn" href="javascript://" title="Показать\Скрыть блок">Показать</a>

</div>
</div>

CSS

.hideWrap {
    text-align:left;
    clear:both;
}
.hideBtn {
    display:block;
    background:transparent url('http://likbezz.ru/_example/_img/_lib1/_plus.gif') no-repeat left center;
    font:bold 11px/15px Verdana, sans-serif;
    cursor:pointer;
    outline:none;
    padding:1px 14px 2px;
}
.hideBtn.show {
    background-image:url('http://likbezz.ru/_example/_img/_lib1/_minus.gif');
}
.hideCont {
    display:none;
}

JavaScript

$(function () {
    /* Start DocumentReady */
    var $hidecont = $('div.hideWrap>div.hideCont');
    /* StartClickFunction */
    $('div.hideWrap a.hideBtn').on('click', function () {
        var $this = $(this);
        var $parent = $this.parent();
        if ($this.hasClass('show')) {
            hide_block($this);
            return false;
        }
        if ($parent !== $hidecont.parent()) {
            hide_block($hidecont.parent().find('.hideBtn'), function () {
                $parent.append($hidecont);
                show_block($this);
            },'fast');
        } else show_block($this);
        return false;
    });

    function hide_block($block, callback,speed) {
        speed=speed||'normal';
        $block.removeClass('show');
        return $hidecont.slideUp(speed, callback);
    }

    function show_block($block, callback,speed) {
        speed=speed||'normal';
        $block.addClass('show');
        return $hidecont.slideDown(speed, callback);
    }

    /* End DocumentReady */
});