I am using the following to open a Bootstrap 5 modal and open a page (/terms-and-conditions):

var myModal = new bootstrap.Modal(document.getElementById("termsModal"), {});

$('.openTerms').on('click',function(e){
       e.preventDefault();
       $('.modal-body').load('/terms-and-conditions', function(){
           myModal.show();
       });
});

And this works, loading the entire page with header and footer. So I tried to load just the contents of the body like this:

var myModal = new bootstrap.Modal(document.getElementById("termsModal"), {});

$('.openTerms').on('click',function(e){
       e.preventDefault();
       $('.modal-body').load('/terms-and-conditions#body', function(){
           myModal.show();
       });
});

But it doesn’t work, still loads the entire page. How do I load just the specific body content of the page with the id=”body”?