How do I make Alert disappear after I display it in a div?

Question

I am making an application using Javascript and Jquery, and when I put an Alert to display an error in a div, it does not disappear, just by clicking on the x to close, I would like to know how to make it disappear after some time.

 Código HTML
 <div id="erro" class="alert alert-danger alert-dismissible fade show">
                        <button type="button" class="close" onclick="$('#erro').hide()">&times;</button>
                        IP fora da faixa, por favor, digite dois IP's válidos
 </div>


Código JavaScript
$("#erro").show();

Answer 1

To make Alert run for a certain period of time, use the setTimeout function. As in the example:

$("#erro").show();
setTimeout(function () {
  $("#erro").hide();
}, 3000);

In case, this '3000' means it will run for 3 seconds until it disappears, you can change as you wish.

Answer 2

It is not necessary to use a library (85KB) for so little, 6 lines of javascript (220 bytes) solve.

    setTimeout(function () {
      document.getElementById("erro").style.display = "none";
    }, 3000);
    function hide(){
    document.getElementById("erro").style.display = "none";
    }

 <div id="erro" class="alert alert-danger alert-dismissible fade show">
                        <button type="button" class="close" onclick="hide()">&times;</button>
                        IP fora da faixa, por favor, digite dois IP's válidos
 </div>