Enable this command through button - if-statement

Question

Right now, the following command operates automatically. I am wondering how I can create a button that will enable the getUserMedia command, and subsequently display the text below.
navigator.getUserMedia = (navigator.getUserMedia ||
navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia ||
navigator.msGetUserMedia);
if (navigator.getUserMedia) {
navigator.getUserMedia({
video:true, audio: true
},
function(stream) {
// returns true if any tracks have active state of true
var result = stream.getVideoTracks().some(function(track) {
return track.enabled && track.readyState === 'live';
});
if (!result) {
$('.abada').append('<h4>2000(works)</h4>');
} else {
$('.abada').append('<h4>2000(works)</h4>');
}
},
function(e) {
$('.abada').append('<h4>2001(does not work)</h4>');
});
}

Answer 1

The key here is to use an onclick function. So we can use:
onclick="function" as an attribute for the HTML tag,
var element = document.querySelector("#button");
element.addEventListener("click", function);,
element.onclick = function; are both acceptable in JavaScript,
var element = $("#button");
element.on("click", function);,
element.click(function); in jQuery.
Shown below:
Using jQuery:
$('#button').on("click", function () {
if (navigator.getUserMedia) {
navigator.getUserMedia({
video: true, audio: true
}, function(stream) {
// returns true if any tracks have active state of true
var result = stream.getVideoTracks().some(function(track) {
return track.enabled && track.readyState === 'live';
});
if (!result) {
$('.abada').append('<h4>2000(works)</h4>');
} else {
$('.abada').append('<h4>2000(works)</h4>');
}
}, function(e) { $('.abada').append('<h4>2001(does not work)</h4>');
});
);
HTML:
<button id="button">Click Me For Streaming</button>