<table style="border:0;padding:0;border-collapse:collapse;color:#000;width:100%">
  <thead>
    <tr>
      <td class="td1">Which of the following are the BEST OPTIONS for you?</td>
      <td class={if(ptm_1=="Y","tdf","hidden")}> </td>
      <td class={if(ptm_1=="Y","tdn","hidden")}><strong>car</strong></td>
      <td class={if(ptm_3=="Y","tdf","hidden")}> </td>
      <td class={if(ptm_3=="Y","tdn","hidden")}><strong>bike</strong></td>
      <td class={if(ptm_2=="Y","tdf","hidden")}> </td>
      <td class={if(ptm_2=="Y","tdn","hidden")}><strong>ebike</strong></td>
    </tr>
  </thead>
  <tbody>
    <tr style="height: 3px; text-align: center;">
    </tr>
    <tr>
      <td class="td1">riding time</td>
      <td class={if(ptm_1=="Y","tdf","hidden")}> </td>
      <td class={if(ptm_1=="Y","tdn","hidden")}>Option 1</td>
      <td class={if(ptm_3=="Y","tdf","hidden")}> </td>
      <td class={if(ptm_3=="Y","tdn","hidden")}>Option 2</td>
      <td class={if(ptm_2=="Y","tdf","hidden")}> </td>
      <td class={if(ptm_2=="Y","tdn","hidden")}>Option 3</td>
    </tr>
    <tr style="height: 3px; text-align: center;">
    </tr>
    <tr>
      <td class="td1">cost</td>
      <td class={if(ptm_1=="Y","tdf","hidden")}> </td>
      <td class={if(ptm_1=="Y","tdn","hidden")}>Option 1</td>
      <td class={if(ptm_3=="Y","tdf","hidden")}> </td>
      <td class={if(ptm_3=="Y","tdn","hidden")}>Option 2</td>
      <td class={if(ptm_2=="Y","tdf","hidden")}> </td>
      <td class={if(ptm_2=="Y","tdn","hidden")}>Option 3</td>
    </tr>
    <tr style="height: 3px; text-align: center;">
    </tr>
    <tr>
      <td class="td1"><strong>Which option would you prefer?</strong></td>
      <td class={if(ptm_1=="Y","tdf","hidden")}> </td>
      <td class={if(ptm_1=="Y","tdn","hidden")}> </td>
      <td class={if(ptm_3=="Y","tdf","hidden")}> </td>
      <td class={if(ptm_3=="Y","tdn","hidden")}> </td>
      <td class={if(ptm_2=="Y","tdf","hidden")}> </td>
      <td class={if(ptm_2=="Y","tdn","hidden")}> </td>
    </tr>
  </tbody>
</table>
 
<script type="text/javascript" charset="utf-8">
  $(document).on('ready pjax:scriptcomplete',function(){
 
    // Identify this question
    var thisQuestion = $('#question{QID}');
 
    // Move the radios
    {if(ptm_1=="Y","$('.question-text table:eq(0) tr:last td:eq(2)', thisQuestion).append($('.subquestion-list .answers-list:eq(0) .answer-item:eq(0) *', thisQuestion));","")}
    {if(ptm_3=="Y","$('.question-text table:eq(0) tr:last td:eq(4)', thisQuestion).append($('.subquestion-list .answers-list:eq(0) .answer-item:eq(1) *', thisQuestion));","")}
    {if(ptm_2=="Y","$('.question-text table:eq(0) tr:last td:eq(6)', thisQuestion).append($('.subquestion-list .answers-list:eq(0) .answer-item:eq(2) *', thisQuestion));","")}
 
    // Some classes for presentation
    $('.question-text table:eq(0) input:radio', thisQuestion).closest('td').addClass('answer-item radio-item text-center radio');
    $('.question-text table:eq(0) .radio-item label', thisQuestion).show();
 
    // Click event on the table cells
    $('.question-text table:eq(0) .radio-item', thisQuestion).on('click', function(e) {
      $('input:radio', this).trigger('click');
    });
    $('.question-text table:eq(0) input:radio', thisQuestion).on('click', function(e) {
      e.stopPropagation();
    });
 
    // Clean-up styles
    $('.answer-container', thisQuestion).hide();
    $('.question-text table:eq(0) .label-text', thisQuestion).remove();
    $('.question-text table:eq(0) .radio-text', thisQuestion).css({
      'cursor': 'pointer'
    });
  });
</script>
<style type="text/css">
  thead td.tdn {
   background-color:#D4D7E4;
   text-align:center;
   font-size:11pt;
   padding-top:1em;
   padding-bottom:1em;
   vertical-align:middle;
  }
  tbody td.tdn {
   background-color:#f2f2f2;
   text-align:center;
   font-size:11pt;
   vertical-align:middle;
  }
 
  tbody td.tdf {
    width: 0px;
  }
</style>