Open and Close bootstrap modal using jquery?

To close bootstrap modal you can use 'hide' as option to modal method as follow

$('#modal').modal('hide');

similarly, to open Modal pop-up using jquery, you can use

$('#modal').modal('show');

Or you can simply toggle the state of Modal pop-up using this Jquery Toggle

$('#modal').modal('toggle');

Using Pure Javascript to open or close Bootstrap Modal

To Close (Using Bootstrap 5)

var myModalEl = document.getElementById('myModal');
var modal = bootstrap.Modal.getInstance(myModalEl)
modal.hide();

To Open:

var myModalEl = document.getElementById('myModal');
var modal = bootstrap.Modal.getInstance(myModalEl)
modal.show();

That's it.

Related Questions:

Disable modal pop-up from closing when clicking outside it

How to call jQuery function when pop-up modal is opened or closed?

Bootstrap has a few functions that can be called manually on modals:

$('#myModal').modal('toggle');
$('#myModal').modal('show');
$('#myModal').modal('hide');

You can see more here: Bootstrap modal component

Sometimes jQuery get's conflicted due to some plugins which cause errors or we include jquery twice by mistake and above code doesn't work, in this case, add

jQuery.noConflict(); 
$('#myModal').modal('show');  // to show Modal pop-Up with Id 'myModal'
$('#myModal').modal('hide'); // to hide Modal pop-Up with Id 'myModal'

You can also try the below method

$('#myModal').appendTo("body").modal('show');

you need to place this code inside jQuery document.ready function.