删除jQuery依赖项

我正在编写一个小型HTML页面，其中包含一个具有放大功能的图像。

<div id="zoom-container">
    <div id="img_wrapper" class="img-wrapper">
        <img id="img_place" src="Figures/Species_copy_number.png" onclick="cenas()" />
    </div>
</div>

我只在以下代码中使用jQuery：

window.zoomedIn = false;
function cenas() {
    var el = this, elp = $("#zoom-container");
    var zoomContainer = $("#img_wrapper");
    if (window.zoomedIn) {
        zoomContainer.css("transform", "");
        elp.css("overflow", "auto");
        window.zoomedIn = false;
    } else {
        var top = el.offsetTop;
        var left = el.offsetLeft - 0.25*zoomContainer[0].clientWidth;
        var tro = (Math.abs(elp.offsetTop - el.offsetTop) > 0) ? "bottom" : "top";
        tro += (Math.abs(elp.offsetLeft - el.offsetLeft) > 0) ? " right" : " left";
        zoomContainer.css({"transform-origin": tro, "transform": "scale(2)"});
        window.zoomedIn = true;
    }
}

为一个js函数导入一个巨大的文件似乎没有用。我试图删除它，并使用原生js使一切正常工作。到目前为止，我有这个：

window.zoomedIn = false;
function cenas() {
    var el = this, elp = document.getElementById("zoom-container");
    var zoomContainer = document.getElementById("img_wrapper");
    if (window.zoomedIn) {
        elp.setAttribute("overflow", "auto");
        window.zoomedIn = false;
    } else {
        var top = el.offsetTop;
        var left = el.offsetLeft - 0.25*zoomContainer.clientWidth;
        var tro = (Math.abs(elp.offsetTop - el.offsetTop) > 0) ? "bottom" : "top";
        tro += (Math.abs(elp.offsetLeft - el.offsetLeft) > 0) ? " right" : " left";
        zoomContainer.setAttribute("transform-origin", tro + " 0px; transform: scale(2);");
        window.zoomedIn = true;
    }
}

它似乎执行了正确的css转换，但什么也没发生。

有人能帮我删除jquery依赖项吗？

感谢

编辑：用作：

    window.zoomedIn = false;
    function cenas() {
        var el = this, elp = document.getElementById("zoom-container");
        var zoomContainer = document.getElementById("img_wrapper");
        if (window.zoomedIn) {
            elp.setAttribute("style", "overflow: auto");
            zoomContainer.setAttribute("style", "transform :'"'"");
            window.zoomedIn = false;
        } else {
            var top = el.offsetTop;
            var left = el.offsetLeft - 0.25*zoomContainer.clientWidth;
            var tro = (Math.abs(elp.offsetTop - el.offsetTop) > 0) ? "bottom" : "top";
            tro += (Math.abs(elp.offsetLeft - el.offsetLeft) > 0) ? " right" : " left";
            zoomContainer.setAttribute("style", "transform-origin: "+ tro + " 0px; transform: scale(2);");
            window.zoomedIn = true;
        }
    }