Textarea count characters not working as needed

by Aides

HTML

<textarea name="" id="txtarea" cols="30" rows="10"></textarea>
<p id="demo"></p>

JavaScript

var txt = document.getElementById("txtarea");
txt.setAttribute("maxlength", 50)
var maxLength = 50;
var demo = document.getElementById("demo");
var checkLength = function(){
    if(txt.value.length <= maxLength) {
        var result = demo.innerHTML =  " Character remaining: " + (maxLength-txt.value.length) 
    };  
};
setInterval(checkLength, 300);