<p>Change this and that and try again. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum.</p>
<buttontype="button"class="btn btn-danger">Take this action</button>
<p>Change this and that and try again. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum.</p>
<buttontype="button"class="btn btn-secondary">Or do this</button>
<p>
</p>
<buttontype="button"class="btn btn-danger">Take this action</button>
</div>
<buttontype="button"class="btn btn-secondary">Or do this</button>
</div><!-- /example -->
</p>
</div>
{% endexample %}
<h2id="alerts-usage">Usage</h2>
<p>Enable dismissal of an alert via JavaScript:</p>
<p>Just add <code>data-dismiss="alert"</code> to your close button to automatically give an alert close functionality.</p>
{% highlight js %}
{% highlight html %}<buttontype="button"class="close"data-dismiss="alert"><spanaria-hidden="true">×</span><spanclass="sr-only">Close</span></button>{% endhighlight %}
$(".alert").alert()
{% endhighlight %}
<h3>Methods</h3>
### Markup
<h4>$().alert()</h4>
<p>Wraps all alerts with close functionality. To have your alerts animate out when closed, make sure they have the <code>.fade</code> and <code>.in</code> class already applied to them.</p>
Just add `data-dismiss="alert"` to your close button to automatically give an alert close functionality.
<p>Bootstrap's alert class exposes a few events for hooking into alert functionality.</p>
<divclass="table-responsive">
### Methods
<tableclass="table table-bordered table-striped">
<thead>
#### $().alert()
<tr>
<thstyle="width: 150px;">Event Type</th>
Wraps all alerts with close functionality. To have your alerts animate out when closed, make sure they have the `.fade` and `.in` class already applied to them.