To set an outline on a button that indicates information, you need to use the btn-outline-info class in Bootstrap.Include the button element and set the btn-outline-info class −   More Info You can try to run the following code to implement the btn-outline-info class −ExampleLive Demo     ... Read More

The hidden.bs.modal event in Bootstrap fires when the modal is completely hidden.Hide the modal on button click −$("#button1").click(function(){   $("#newModal").modal("hide"); });After you will hide it, use the hidden.bs.modal Bootstrap event to generate an alert before the modal completely hides −$("#newModal").on('hidden.bs.modal', function () {   alert('The modal is completely hidden now!'); ... Read More

To show flex items vertically on different screen sizes, use the flex-*- column class. For small, medium and large screen sizes, use it as −For Small screen size −For Medium screen size −For Large screen size −Let us see an example to learn how to set flex items vertically on ... Read More

If you want to set content as a Bootstrap modal, then use the .modal(options) method.On button click, the modal generates as in the following script.$(document).ready(function(){   $("#button1").click(function(){     $("#newModal1").modal({backdrop: true});   }); });Above, I have set options as “backdrop:true”. Another option, we can set is “backdrop: true” −backdrop: true = ... Read More

If you want to set a dark border to an element, use the border-dark class.Spot the difference between a normal border and dark border −To add a dark border, you need to simply add it like any other class in div as shown below −   Dark Border Above, the ... Read More

Use the border-info class in Bootstrap, to set a border that indicates information. Set the class as if you use any other class in Bootstrap:   Details Above, we added border-info class. Another class, “one” is used to give shape to the div element −.one {   width: 180px;   ... Read More

Use align-text-bottom class to align an element with the bottom of the parent element's font.You need to set the align-text-bottom class as shown below −   Bottom Text You can try to run the following code to implement the align-text-bottom class in Bootstrap 4 −ExampleLive Demo   Bootstrap ... Read More

Use .align-content-around class to align gathered items "around" in Bootstrap 4.The align-content-around class is set like the below code snippet −After that add the flex items −   One   Two   Three   Four Let us see an example to align gathered items around −ExampleLive Demo   ... Read More

The jQuery.extend() method is used to merge contents of two or more objects together. The object is merged into the first object. You can try to run the following code to learn how to use extend() method −ExampleLive Demo $(document).ready(function() {   $("#button1").click(function() {     ... Read More

To iterate over arrays and objects in jQuery, use the jQuery forEach() loop. You can try to run the following code to learn how to iterate over arrays and objects −ExampleLive Demo $(document).ready(function(){   $("#button1").click(function(){     var arr = [{subject: "Maths", id:3}, {subject: "History", id:7}]; ... Read More