title: How can I create a modal using Semantic UI in HTML/CSS?
body: <p>So I'm creating a GUI using html and want to open a modal on the click of a button. What JS would I need to make this happen? Below is the code with a basic modal all I need is the JS to make it open. I'm using nodejs and electron.</p>
  
  <p>HTML</p>
  
  <pre><code>    &lt;div style = 'position: fixed; top: 25px; left: 900px ' class = 'ui container'&gt;
        &lt;input type="button" id="sTask" class = 'ui inverted basic green button' value="Start Tasks"&gt;
        &lt;input type="button" id="eTask" class = 'ui inverted basic yellow button' value="End Tasks"&gt;
        &lt;input type="button" id="dTask" class = 'ui inverted basic red button' value="Delete Tasks"&gt;
      &lt;/div&gt;
  
        &lt;div style ="position:fixed; top: 25px; left: 102px"&gt;
          &lt;button id="cTask" class = 'ui inverted basic blue button' data-modal-target="empty"&gt;Create New Task &lt;/button&gt;
  
          &lt;div id="modal" class="ui basic modal" data-model="empty"&gt;
            &lt;div class="ui icon header"&gt;
              Archive Old Messages
            &lt;/div&gt;
            &lt;div class="content"&gt;
              &lt;p&gt;Your inbox is getting full, would you like us to enable automatic archiving of old messages?&lt;/p&gt;
            &lt;/div&gt;
            &lt;div class="actions"&gt;
              &lt;div class="ui red basic cancel inverted button"&gt;
                &lt;i class="remove icon"&gt;&lt;/i&gt;
                  No
              &lt;/div&gt;
            &lt;div class="ui green ok inverted button"&gt;
                &lt;i class="checkmark icon"&gt;&lt;/i&gt;
                  Yes
            &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  
  </code></pre>