JSFiddle - React, Tailwind, and code Playground

by klierik

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-2.2.0.min.js"></script>
<div class="alert alert-success" role="alert">
Maecenas faucibus mollis interdum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec ullamcorper nulla non metus auctor fringilla. Donec id elit non mi porta gravida at eget metus. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras mattis consectetur purus sit amet fermentum.
</div>

CSS

body {
  padding: 5%;
}

JavaScript

jQuery(document).ready(function ($) {
    $(document).on('click', function(e){
        var $target = $(e.target);
        
        if(!$target.hasClass(".alert") && !$target.closest(".alert").length) {
            $(".alert").slideToggle();
        }
    })
});