jQuery - Adding Smooth Scrolling and CSS to element on a different page

I have 3 Anchor links on one page that lead to different sections of another page. I want to add some styling to the target element on the destination page. What I have so far

jQuery(document).on('click', 'a[href^="#"]', function (event) {

    
    var offset = 200;
var $target = jQuery(this.hash);
event.preventDefault();

   jQuery('html, body').animate({
        scrollTop: jQuery(jQuery.attr(this, 'href')).offset().top - offset
    }, 500);
$target.css({'border' : 'solid 1px #ff4800' , 'padding' : '9px calc(5% - 1px)' });
    setTimeout(function() {$target.css({'border' : 'none' , 'padding' : '10px 5%' });}, 2500);
});

This currently only works if the anchor link is clicked on the same page as the targets. How do I get it to be triggered from other pages as well?

Thanks