JavaScript URL encode, decode and escape

Introduction

I was sick of having to look up the difference between urlencode, encodeURIComponent and escape, so here's a quick online tool for those who need it.

Encode DecodeEnter some text and choose whether to encode or decode

The Code

<script type="text/javascript">
    function Process() {

        var source = document.getElementById('text');
        var text   = "" + source.value;
        var target = document.getElementById("result");
        var result = "";

        if (document.getElementById('encode').checked === true) {
            result += "<h4>urlEncode</h4><p>" + urlencode(text) + "</p>";
            result += "<h4>encodeURI</h4><p>" + encodeURI(text) + "</p>";
            result += "<h4>encodeURIComponent</h4><p>" + encodeURIComponent(text) + "</p>";
            result += "<h4>escape</h4><p>" + escape(text) + "</p>";
        }
        else {
            result += "<h4>urldecode</h4><p>" + urldecode(text) + "</p>";
            result += "<h4>decodeURI</h4><p>" + decodeURI(text) + "</p>";
            result += "<h4>decodeURIComponent</h4><p>" + decodeURIComponent(text) + "</p>";
            result += "<h4>unescape</h4><p>" + unescape(text) + "</p>";
        }

        target.innerHTML = result;
    }

    function urlencode(text) {
        return encodeURIComponent(text).replace(/!/g,  '%21')
                                       .replace(/'/g,  '%27')
                                       .replace(/\(/g, '%28')
                                       .replace(/\)/g, '%29')
                                       .replace(/\*/g, '%2A')
                                       .replace(/%20/g, '+');
    }
    function urldecode(text) {
        return decodeURIComponent((text + '').replace(/\+/g, '%20'));
    }
</script>