JSFiddle - React, Tailwind, and code Playground

CSS

ul, p {padding:15px 15px}
p {border:2px solid #369}
.active {color:red}

JavaScript

$(function() {
  var award_array = {"award-sites":{"content":"<p>Content f\u00fcr Award-Sites<\/p>"},"belgica":{"content":"<p>Content f\u00fcr Belgica<\/p>"},"wsaptronic":{"content":"<p>Content f\u00fcr wsaptronic<\/p>"}};
  var list = '';
  $.each(award_array, function(key, value) {
      list += '<li><a href="?award=' + key + '" data-key="' + key + '">' + key + '</a></li>';
  });
  // Element erzeugen
  var create_list = document.createElement("ul");
  create_list.id = 'award_list';
  create_list.innerHTML = list;
  $('body').prepend(create_list);
  $("#award_list a").on("click", function()
  {
      if ($(this).attr('class') == 'active') {
        return false;
      }
      $('#award_list a').removeClass('active');
      $(this).addClass('active');
      var arr_key = $(this).data('key');
      var arr_val = award_array[arr_key]['content'];
      $('body p').remove();
      $('#award_list').after(arr_val);
      $('p').hide().fadeIn(250);
      return false;
  });
});