物化;模态显示身体上的按钮

Question

我正在尝试为学校项目（我的上一个项目）创建一个“赌场”。我正在使用Materializecss显示模态。并使用javascript为每个单击的按钮显示其他内容。

我一直在寻找解决方案。但是我真的不知道如何格式化我的问题。这是一张图片； 如您所见，它显示了2个按钮，您可以在其中通过模式选择尾巴或头部。

模式代码；

  <div id="modal1" class="modal">
    <div class="modal-content">
      <h4 id="header"></h4>
      <div id="text"></div>
    </div>
    <div class="modal-footer">
      <a href="#!" class="modal-close waves-effect waves-green btn-flat">Close</a>
    </div>
  </div>

触发模式的按钮；

<li><a onclick="loginmodal();" class="btn modal-trigger" href="#modal1">Login</a></li>

还有javascript;

 $(document).ready(function(){
 $('.modal-trigger').leanModal();
 });

function loginmodal() {
document.getElementById("header").innerHTML = "Login";
document.getElementById("text").innerHTML = "Login stuff here<br><br><br><br><br><br><br><br><br><br><br><br>";
}

它不应通过模式显示按钮。正如目前所做的那样。这些按钮是可单击的，并且在显示表单时，它不应该在那里。