Edit in JSFiddle

var BrowserDetect = {
	init: function () {
        //Javascript is clearly working.
        //Introduced by Netscape in 1996.
        this.displayTestResult('javascript', 'Javascript test: <span>active</span>'); 
        //Detect AJAX...
        //Introduced by IE in version 5 in 1999.
        this.detectAJAX();
        //Detect rgba() support...
        //Supported by FF3+, Safari3+, Chrome, Opera10+, IE9+
        this.detectRGBA();
        //Detect linear-gradient support...
        //Standard syntax supported by FF16+, Safari6.1+, Chrome26, Opera12.1+, IE10+
        this.detectGradients();
	},
    //id is the id of the paragraph
    //message is the message to be displayed
    //display is a boolean - true to display the message
	displayTestResult: function (id, message) {
        if (id) {
		    var htmlEl = document.getElementById(id);
    		htmlEl.innerHTML = message;
        }
	},
    detectAJAX: function () {
        var ajaxCheck = "ajax";
        if (XMLHttpRequest) { //IE>=7 or other browser >2005 release.
            this.displayTestResult(ajaxCheck, 'true');
        } else {
            try {
                //IE5 and 6 support AJAX only via ActiveXObject.
                var activeXAjax = new ActiveXObject("Microsoft.XMLHTTP");
                this.displayTestResult(ajaxCheck, 'true - ActiveXObject.');
                var prevNode = document.getElementById(ajaxCheck);
                var newNode = document.createElement("p");
                newNode.id = "ie5to6";
                newNode.innerHTML = "You are using a very old browser! IE6 detected.";
                prevNode.parentNode.insertBefore(newNode, prevNode);
            } catch(e) {
                //AJAX not supported.  Is this browser older than 2005?
                this.displayTestResult(ajaxCheck, 'false');
            }
        }
    },
    detectRGBA: function () {
        var testNodeId = "rgba";
        var value = "rgba(150,0,0,0.2)";
        var testNode = document.getElementById(testNodeId);
        testNode.style.cssText = "background-color:" + value;
        //Thanks Derek for this version that works correctly in Opera 9.6 too
        //http://lea.verou.me/2009/03/check-whether-the-browser-supports-rgba-and-other-css3-values/#comment-868403646
        if(!!~('' + testNode.style.backgroundColor).indexOf("rgba")) {
            this.displayTestResult(testNodeId, 'true');
        } else {
            //rgba() not supported.  Is this browser older than 2009?
            this.displayTestResult(testNodeId, 'false - you seriously need to update your browser!');
        }
    },
    detectGradients: function () {
        var testNodeId = "gradients";
        var value = "linear-gradient(to top, #99f, #9f9)";
        var testNode = document.getElementById(testNodeId);
        testNode.style.cssText = "background-image:" + value;
        if(!!~('' + testNode.style.backgroundImage).indexOf("to top")) {
            //linear-gradients supported.  You must be using a very modern browser.
            this.displayTestResult(testNodeId, 'true');
        } else {
            //linear-gradients (standard syntax) not supported.  When did you last update your browser?
            this.displayTestResult(testNodeId, 'false');
        }
    }
};
BrowserDetect.init();

<h4>This is a javascript browser-check that I'm updating because of IE11's user-agent string.  But this time based on feature rather than User-agent String.  Forked from http://jsfiddle.net/kaya_basharan/cXLLG/33/.</h4>
<!--[if lt IE 6]>
<p id="old_ie_warning">Your browser is obsolete. Leave now.</p>
<![endif]-->
<!--[if gte IE 6]>
<p id="ie_warning">You are using an old version of Internet Explorer.  Please update your browser.</p>
<![endif]--><!-- These conditional comments are supported by IE 5-9 so those are fairly easy to target. -->
<p id="javascript">Javascript is not active in your browser.</p>
<p>AJAX test: <span id="ajax"><i>Initial</i></span></p>
<p>rgba() test: <span id="rgba"><i>Initial</i></span></p>
<p>linear-gradients (standard syntax) test: <span id="gradients"><i>Initial</i></span></p>

[id*=warning] {
    color: #f00;
}
span {
    font-weight: 700;
}