diff --git a/common/lib/xmodule/xmodule/html_module.py b/common/lib/xmodule/xmodule/html_module.py
index a6ec33e08c..216b63a12e 100644
--- a/common/lib/xmodule/xmodule/html_module.py
+++ b/common/lib/xmodule/xmodule/html_module.py
@@ -17,6 +17,9 @@ log = logging.getLogger("mitx.courseware")
 
 
 class HtmlModule(XModule):
+    js = {'coffee': [resource_string(__name__, 'js/src/html/display.coffee')]}
+    js_module_name = "HTMLModule"
+    
     def get_html(self):
         return self.html
 
diff --git a/common/lib/xmodule/xmodule/js/src/html/display.coffee b/common/lib/xmodule/xmodule/js/src/html/display.coffee
new file mode 100644
index 0000000000..05e2ddab28
--- /dev/null
+++ b/common/lib/xmodule/xmodule/js/src/html/display.coffee
@@ -0,0 +1,26 @@
+class @HTMLModule
+
+  constructor: (@element) ->
+  	@el = $(@element)
+  	@setCollapsibles()
+
+  $: (selector) ->
+    $(selector, @el)
+
+  setCollapsibles: =>
+    $('.longform').hide();
+    $('.shortform').append('<a href="#" class="full">See full output</a>');
+    $('.collapsible section').hide();
+    $('.full').click @toggleFull
+    $('.collapsible header a').click @toggleHint
+
+  toggleFull: (event) =>
+    $(event.target).parent().siblings().slideToggle()
+    $(event.target).parent().parent().toggleClass('open')
+    text = $(event.target).text() == 'See full output' ? 'Hide output' : 'See full output'
+    $(this).text(text)
+
+  toggleHint: (event) =>
+    event.preventDefault()
+    $(event.target).parent().siblings().slideToggle()
+    $(event.target).parent().parent().toggleClass('open')
\ No newline at end of file