diff --git a/webapp/src/main/webapp/templates/freemarker/rubric.ftl b/webapp/src/main/webapp/templates/freemarker/rubric.ftl
index f2330967e..70ce7bd88 100644
--- a/webapp/src/main/webapp/templates/freemarker/rubric.ftl
+++ b/webapp/src/main/webapp/templates/freemarker/rubric.ftl
@@ -1,6 +1,8 @@
 <#import "lib-vivo-properties.ftl" as vp>
 <#include "individual-setup.ftl">
 
+${scripts.add('<script type="text/javascript" src="${urls.base}/themes/iph/js/collapsible_elements.js"></script>')}
+
 <section id="individual-intro" class="vcard person" role="region">
   <span itemscope itemtype="http://schema.org/Person">
     <section id="individual-info" ${infoClass!} role="region" style="width: 100%;">
@@ -109,23 +111,3 @@
     </#list>
     </div>
  </#if>
-
-
-<script>
-	var coll = document.getElementsByClassName("collapsible");
-	var i;
-
-	for (i = 0; i < coll.length; i++) {
-	  coll[i].addEventListener("click", function() {
-		this.classList.toggle("active");
-		var content = this.nextElementSibling;
-		if (content.style.display === "block") {
-		  content.style.display = "none";
-		} else {
-		  content.style.display = "block";
-		}
-	  });
-	}
-</script>
-
-
diff --git a/webapp/src/main/webapp/templates/freemarker/rubrics.ftl b/webapp/src/main/webapp/templates/freemarker/rubrics.ftl
index ae08ad5aa..38364c94e 100644
--- a/webapp/src/main/webapp/templates/freemarker/rubrics.ftl
+++ b/webapp/src/main/webapp/templates/freemarker/rubrics.ftl
@@ -1,3 +1,5 @@
+${scripts.add('<script type="text/javascript" src="${urls.base}/themes/iph/js/collapsible_elements.js"></script>')}
+
 <#list rubrics as rubric>
   <#if !rubric.parentUri??>
     <#assign childs = rubric.childs?number>
@@ -13,24 +15,6 @@
 </#list>
 
 
-<script>
-	var coll = document.getElementsByClassName("collapsible");
-	var i;
-	for (i = 0; i < coll.length; i++) {
-	  coll[i].addEventListener("click", function() {
-		this.classList.toggle("active");
-		var content = this.nextElementSibling;
-        if (content.style.display === "block") {
-		  content.style.display = "none";
-		  $(this).children('.collapsibleSign').text('+');
-		} else {
-		  content.style.display = "block";
-		  $(this).children('.collapsibleSign').text('–');
-		}
-	  });
-	}
-</script>
-
 <#macro openButton childs>
   <#if childs &gt; 0>
     <div class="collapsibleSign" style="display:inline-block;width:10px;">+</div>