Добавленные div, охватываемые элементом события

Question

Я пытаюсь добавить на событие список div-ов. Проблема в том, что элементы div отображаются за самим событием. Свойство z-index не работает. В настоящее время прозрачность позволяет видеть элементы div, но они находятся сзади.

Этот код находится под EventRender

  element.find('.fc-bg')
          .append('<br><div style="text-align: center;' + 'z-index: 15;">' +
            '<button mat-button style="width: 80%;' +
            'color: black;' +
            'background-color: lightskyblue;' +
            'font-weight: bold;" id="' + member._id + '" class="employee">' + member.firstName + ' ' + member.lastName +
            '</button></div>');
      });
      if (holes > 0) {
        element.find('.fc-bg')
          .append('<br><div style="text-align: center;' + 'width: 80%;' + 'margin:0 auto;'
            + 'background-color: red;" class="holes">'
            + 'Holes: ' + event.holes + '</div>');
      }[enter image description here][1]