Change text based on parameter within link - ex. welcome message with name

I have a problem with creating simple script. I'm trying to trigger text change when user click specially prepared link. I have a "H" tag title with ID class. This is welcome message. Now I have few links for my friends with look like: http://bit.ly/2G3MSWR http://bit.ly/2Idd0QG

I want to change this H tag title depends on any of this two links. So when User "A" click link I shared with him [that include extra information /#john1 or /#john2 then display custom message for him. But anyone who will use website link without extra parameter will see default title.

Is there any easy way to achieve this?

I tried to achieve something like onclick event with jquery. Set there text for all of this and than access them via mywebsite.com/#john1 etc But looks like this is a bad idea because this doesn't work when add parameter to link. Only when click element on website.

I tried something like this:

$(function() {
    $("#john1, #john2").on("click", function(e) {
        var txt = "";
        switch ($(this).prop("id")) {
            case "john1":
                txt = "Hi john 1";
                break;
            case "john2":
                txt = "Hi John 2";
                break;
        }
        $("#h1-title").text(txt);
    })
})

and than access like: http://bit.ly/2Idd0QG But I know this isn't good use case for that.

I know this is newbie question but hope someone can guide me or help somehow with this issue. Thanks