<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>