document.getElementById can not read property

Question

function displayLeftCheckButton(id, value, labelText) {
        var div = $('<div>', {style: 'display:inline-block'})
        var label = $('<label>', {class: 'radio-inline'})
        var button = $('<button>',
            {
                type: 'button',
                id: 'left_sub'+id
            }
        ).on('click', propList(id));
        button = button.append("▲");
        label = label.append(labelText);
        return div.append(label, button);
    }

    function propList(id) {
        if(document.getElementById("left_sub"+id).innerHTML == "▼") {
            document.getElementById("left_sub"+id).innerHTML = "▲";
            document.getElementById("right_subs"+id).style.display = "inline-block";
        }
        else {
            document.getElementById("left_sub"+id).innerHTML = "▼";
            document.getElementById("right_subs"+id).style.display = "none";
        }
    }

I make a button to change display, but I meet an error cannot read 'document.getElementById("left_sub"+id).innerHTML'

before appending in some html , this code gets an error?