<script type="text/javascript" charset="utf-8"> $(document).ready(function() { // Identify this question var thisQuestion = $('#question{QID}'); // Define the sub-heading text strings var subHeading1 = '<span style="color:maroon">Beoordeel hoe de personen op de afbeelding sich voelen</span><br/><span style="font-size=8pt">(Let op: Nem et perspectief van de personen op de afbeelding niet je eigen perspectief)</span>'; var subHeading2 = '<span style="color:maroon">Beoordeel hoe intens de personen op de afbeelding deze emotie ervaren</span><br/><span style="font-size=8pt">(Let op: Nem et perspectief van de personen op de afbeelding niet je eigen perspectief)</span>'; var subHeading3 = '<span style="color:maroon">In welke mate wordt er sociale interactie afgebeeld</span>'; var columnsLength = $('tr.answers-list:eq(0) > *', thisQuestion).length; // Insert the new rows $('tr.answers-list:eq(0)', thisQuestion).before('<tr class="sub-header-row"><th colspan="'+columnsLength+'">'+subHeading1+'</th></tr>'); $('tr.answers-list:eq(1)', thisQuestion).before('<tr class="sub-header-row"><th colspan="'+columnsLength+'">'+subHeading2+'</th></tr>'); $('tr.answers-list:eq(2)', thisQuestion).before('<tr class="sub-header-row"><th colspan="'+columnsLength+'">'+subHeading3+'</th></tr>'); // Fix up the row classes var rowClass = 1; $('table.subquestions-list tbody tr', thisQuestion).each(function(i) { if($(this).hasClass('sub-header-row')) { rowClass = 1 } else { rowClass++; $(this).removeClass('array1 array2') if(rowClass % 2 == 0) { $(this).addClass('array2'); } else { $(this).addClass('array1'); } } }); }); </script>

<style type="text/css">.sub-header-row { margin-bottom: 20px; } .sub-header-row th { background-color: #efefef; color: #000000 !important; text-align: left; } </style>