<style type="text/css">
div.spolier {
    display: none;
}
</style>

<div class="spoiler">
    <a href="#reveal">!спойлер!</a>
    <p>
        текст под спойлером
    </p>
</div>

<script type="text/javascript"
    src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script type="text/javascript">
(function() {
    var SPOILER_SEL = 'div.spoiler';
    var SPOILER_REVEAL_LINK_SEL = 'a[href=#reveal]';
    var SPOILER_TEXT_SEL = 'p';

    var toggleSpoilerWhenClick = function(event) {
        event.preventDefault();
        var parentElement = $(event.target).parent();
        var spoilerText = $(SPOILER_TEXT_SEL, parentElement);
        if(spoilerText.length) {
            spoilerText.toggle('fast');
        }
    };

    $(function() {
        $([
            SPOILER_SEL,
            SPOILER_TEXT_SEL
        ].join(' ')).hide();
        $([
            SPOILER_SEL,
            SPOILER_REVEAL_LINK_SEL
        ].join(' ')).on('click', toggleSpoilerWhenClick);
    });
}());
</script>