<div id="filtre-profil-orig" style="display: none;">
{{cell.text|safe}}
</div>
<label for="select-filtre-profil">Filtrer par profil</label>
<select id="select-filtre-profil" name="filtre-profil">
  <option value="">— choisir un profil —</option>
</select>
<script>
$(function() {
  var $select = $('select[name=filtre-profil]');
  $('#filtre-profil-orig a').each(function(idx, elem) {
    var $option = $('<option>', {'value': $(elem).attr('href').slice(1), 'text': $(elem).text()});
    $select.append($option);
  });
  $select.on('change', function() {
    var value = $(this).val();
    if (value) {
      $(this).addClass('selected');
      $('.wcsformsofcategorycell').each(function(idx, elem) {
        var matches = $(elem).find('li.keyword-' + value);
        if (matches.length) {
          $(elem).find('li').hide();
          matches.show();
          $(elem).show();
        } else {
          $(elem).hide();
        }
      });
    } else {
      $(this).removeClass('selected');
      $('.wcsformsofcategorycell li').show();
      $('.wcsformsofcategorycell').show();
    }
  });
});
</script>
