title: how to use semantic-ui modal
body: <p>I have problem with semantic-ui modal, when I click order, I would show modal, but modal is not working well. After I click order modal, the modal just showed and then closed by itself.</p>
  
  <p>view code</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div class = "ui form grid_6 omega"&gt;
    &lt;form target="paypal" method="post"&gt;
      &lt;div class="field1"&gt;
        &lt;div class="field"&gt;
          &lt;label&gt;Nama&lt;/label&gt;
          &lt;input placeholder="Nama" name="nama" type="text"&gt;
        &lt;/div&gt;
        &lt;div class="field"&gt;
          &lt;label&gt;No. HP&lt;/label&gt;
          &lt;input placeholder="No. HP" name="handphone" type="text"&gt;
        &lt;/div&gt;
        &lt;div class="field"&gt;
          &lt;label&gt;Alamat&lt;/label&gt;
          &lt;input placeholder="alamat" name="alamat" type="text"&gt;
        &lt;/div&gt;
        &lt;div class="field"&gt;
          &lt;label&gt;Jumlah&lt;/label&gt;
          &lt;div class="selectbox"&gt;
            &lt;select name="jumlah" id=""&gt;
              &lt;?php for ($i=1; $i &lt;= 20; $i++): ?&gt;
              &lt;option value="&lt;?php echo $i; ?&gt;"&gt;&lt;?php echo $i; ?&gt;&lt;/option&gt;
              &lt;?php endfor; ?&gt;
            &lt;/select&gt;
          &lt;/div&gt;
        &lt;/div&gt;
        &lt;button type="submit" name="submit" class="ui teal button order-button"&gt;Order now&lt;/button&gt;
      &lt;/div&gt;
    &lt;/form&gt;
  &lt;/div&gt;
  &lt;div id="modaldiv" class="ui small modal"&gt;
    &lt;i class="close icon"&gt;&lt;/i&gt;
    &lt;div class="header"&gt;
      Smalls Like Bakin
    &lt;/div&gt;
    &lt;div class="content"&gt;
      &lt;p&gt;Thank you for your order&lt;/p&gt;
    &lt;/div&gt;
    &lt;div class="actions"&gt;
      &lt;div class="ui positive right labeled icon button"&gt;
        &lt;a class="text-white" href="&lt;?php echo site_url('home/order');?&gt;"&gt;Back to Home&lt;/a&gt;
        &lt;i class="checkmark icon"&gt;&lt;/i&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>script modal</p>
  
  <pre class="lang-js prettyprint-override"><code>&lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" /&gt;
  
  &lt;script type="text/javascript" src = "&lt;?php echo base_url(); ?&gt;packaged/javascript/semantic.js" /&gt;
  
  &lt;script type = "text/javascript" &gt;
    $('.order-button').click(function () {
      $('#modaldiv').modal('show');
    });
  &lt;/script&gt;
  </code></pre>
  
  <p>Can you help me to solve this problem? thank you.</p>