Edit in JSFiddle

// To add a new test, simply add a descriptive name, and
// the W3 URL and Version Number into a new object in the below tests array
var tests = [{
    name: 'SVG Shapes', 
	url: 'http://www.w3.org/TR/SVG11/feature#Shape',
    version: '1.1'
},{
    name: 'SVG Graphics Attribute', 
	url: 'http://www.w3.org/TR/SVG11/feature#GraphicsAttribute',
    version: '1.1'
},{
    name: 'Use SVG as Image', 
	url: 'http://www.w3.org/TR/SVG11/feature#Image',
    version: '1.1'
}];

window.onload = function() {
    document.querySelector('#cmdDetect').addEventListener('click', DetectFeatures);
}

function DetectFeatures() {
    var output = document.querySelector('#results');
    output.innerHTML = '';

    if (tests.length > 0) {
        var table = document.createElement('table');
        var row = document.createElement('tr');
        var th4 = document.createElement('th');
	   var th1 = document.createElement('th');
        var th2 = document.createElement('th');
        var th3 = document.createElement('th');
		th4.scope = "col";
        th4.innerText = "Test Name"
		
        th1.scope = "col";
        th1.innerText = "Spec to test against"

        th2.scope = "col";
        th2.innerText = "Spec Version"

        th3.scope = "col";
        th3.innerText = "Test Pass Result"

		row.appendChild(th4);
        row.appendChild(th1);
        row.appendChild(th2);
        row.appendChild(th3);
        table.appendChild(row);

        for (var i = 0; i < tests.length; i++) {
            var row = document.createElement('tr');
            var td1 = document.createElement('td');
            var td2 = document.createElement('td');
            var td3 = document.createElement('td');
			var td4 = document.createElement('td');

            td4.innerText = tests[i].name;
			td1.innerText = tests[i].url;
            td2.innerText = tests[i].version;
            td3.innerText = document.implementation.hasFeature(tests[i].url, tests[i].version);
            td3.classList.add(td3.innerText);

            row.appendChild(td4);
			row.appendChild(td1);
            row.appendChild(td2);
            row.appendChild(td3);

            table.appendChild(row);
        }
        output.appendChild(table);
    }
}
<h1>Test what W3 specs your browser supports</h1>
<div id="results">
    <p>
        Tests not ran yet.
    </p>
</div>
<button id="cmdDetect">Detect Features</button>
@import "https://fonts.googleapis.com/css?family=Roboto:400,700";
body {
    font-size: 14px;
    font-family: 'Roboto';
}

table {
	th, td {
        text-align: left;
        padding: .4em;
    }
	
	.true {
		background: rgb(51, 153, 51);
		color: #fff;
	}
	.false {
		background: rgb(204, 0, 0);
		color: #fff;
	}
	
	th[scope^="col"] {
		background: #000;
		color: #fff;
	}
	
	tr:nth-child(odd) {
		background: rgba(0,0,0,0.2);
	}
}