How do I create a userscript that creates a button on a webpage, that when clicked, runs the GM_registerMenuCommand for that userscript?

I have a userscript that includes a GM_registerMenuCommand('Render LaTeX', () => { (and so forth) that makes part of the userscript only run when manually triggered by selecting the ViolentMonkey addon from my browser bar, then clicking the button labeled “Render LaTeX”.

I want to add a button to the webpage this userscript is set to match, which when clicked does the above. I’m just at a loss for how to do so. The only information even regarding buttons I’ve yet been able to find was here.

I’ve tried tinkering with the code provided in the second answer to the linked question. I was able to adjust the text and positioning, but I couldn’t figure out how to make the button do what I want or change its appearance to better fit into the website it’s going on.

// ==UserScript==
// @name        TeX Button
// @namespace   all
// @match     https://mail.google.com/mail/*
// @version     1
// @grant       none
// ==/UserScript==

(function(){
    'use strict'

  window.addEventListener('load', () => {
    addButton('TeX', selectReadFn)
    })

    function addButton(text, onclick, cssObj) {
        cssObj = cssObj || {position: 'absolute', bottom: '92.375%', left:'19.35%', 'z-index': 3}
        let button = document.createElement('button'), btnStyle = button.style
        document.body.appendChild(button)
        button.innerHTML = text
        button.onclick = onclick
        Object.keys(cssObj).forEach(key => btnStyle[key] = cssObj[key])
        return button
    }

    function selectReadFn() {
        [...document.getElementsByClassName('MN')].filter(isRead).forEach(element => element.click())
    }

    function isRead(element) {
        childs = element.parentElement.parentElement.parentElement.getElementsByClassName('G3')
        return ![...childs].some(e => e.innerText.search(/unread/i)!==-1)
    }

}())