title: Bootstrap modal not hiding properly
body: <p>I'm using a bootstrap modal to show some info to a user that access a site, so I need it to show right when this user has access to that site. Used a similar modal in another page that showed after clicking a button and I had no problems with it, but now, since I'm showing the modal right when the page loads, I can't hide it after pressing the button. Any help would be very much appreciated. Also, I don't think it matters that much, but I'm using Yii.</p>
  
  <p>Here's the code:</p>
  
  <pre><code>&lt;div id='modalConfirm' class="modal" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true"&gt;
    &lt;div class="modal-dialog modal-sm"&gt;
      &lt;div class="modal-content"&gt;
        &lt;h4 class="modal-title" align="center"&gt;Reservation Confirmation&lt;/h4&gt;
        &lt;/div&gt;
        &lt;div class="modal-body" align="center"&gt;
          &lt;p&gt;This is your confirmation&lt;/p&gt;
        &lt;/div&gt;
        &lt;div class="modal-footer"&gt;
          &lt;button id="accButton" type="button" class="btn btn-info" data-target="#modalConfirm" data-dismiss="modal"&gt;Accept&lt;/button&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <pre><code> $(function(){
       $('#accButton').click(function(){
            $('#modalConfirm').modal('hide');
        });
    });
  </code></pre>
  
  <p></p>