事件元素覆盖的附加div

Question

我正在尝试在事件中添加一个div列表。问题是divs显示在事件本身后面。 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]