Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
Show and hide comments, using jQuery
button.showComments { margin-right: .5em }
.comment { font: inherit; white-space: pre-wrap; color: #ccc }
<p><button class="showComments">Show Comments</button>
<!-- Example -->
// Create button.showComments to interface
// Style .comment for flavour
function showComments() {
$('*').contents().filter(function() {
return this.nodeType == 8;
}).each(function(i, e) {
pre = $('<pre class="comment"></pre>');
pre.text(e.nodeValue.replace(/^[ \t\r\n]+/, ''));
// pre.wrap('<details></details>');
// $('<summary>&lt;!-- --&gt;</summary>').insertBefore(pre);
$('button.showComments').text('Hide Comments').click(hideComments);
function hideComments() {
$('button.showComments').text('Show Comments').click(showComments);
$(function() {

sbp commented Dec 10, 2011

The "fiddle" filenames are to enable the preview of this code on jsFiddle.


sbp commented Feb 12, 2012


Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment