function create_modal(title, content, footer) {
    let div = document.createElement('div');
    div.innerHTML = `<div id="modal">
        <div id="content">
            <div id="modal_header">
                <h3 id="modal_title">${title || "&nbsp"}</h3>
                <span><i class="material-icon" onclick="remove_modal();">close</i></span>
            </div>
            <div class="divider"></div>
            <div id="modal_content">
                ${content}
            </div>
            <div class="divider"></div>
            <div id="modal_footer">
                ${footer || "&nbsp"}
            </div>
        </div>
    </div>`
    document.body.appendChild(div.firstChild);
}

function remove_modal() {
    document.getElementById('modal').remove();
}

function change_modal_content(content) {
    document.getElementById("modal_content").innerHTML = content;
}