JSFiddle - React, Tailwind, and code Playground

HTML

<p id="result1"></p>
<p id="result2"></p>
<p id="result3"></p>
<p id="result4"></p>

JavaScript

function addParam(url, param, value) {
        var a = document.createElement('a'), regex = /(?:\?|&amp;|&)+([^=]+)(?:=([^&]*))*/g;
       var match, str = []; a.href = url; param = encodeURIComponent(param);
       while (match = regex.exec(a.search))
           if (param != match[1]) str.push(match[1]+(match[2]?"="+match[2]:""));
       str.push(param+(value?"="+ encodeURIComponent(value):""));
       a.search = str.join("&");
       return a.href;
    }

var url = "http://www.example.com?foo=bar&pippo&paperino#hashme";

var result1 = document.getElementById("result1");
result1.innerHTML = addParam(url, "ciao", "1");

url = "http://www.example.com#hashme";

var result2 = document.getElementById("result2");
result2.innerHTML = addParam(url, "ciao", "1 l'app");

url = "http://www.example.com?foo=bar&pippo=pluto#hashme";

var result3 = document.getElementById("result3");
result3.innerHTML = addParam(url, "ciao2");
url = "http://www.example.com?foo=bar&pippo=pluto#hashme";

var result4 = document.getElementById("result4");
result4.innerHTML = addParam(result3.innerHTML, "ciao2", "1èéê");