Following code is working fine when browsed from local directory but not working after integrating into a ReactJS app.

I have downloaded an online template to integrate to React application. It has main.js file. It includes css class based events that's not working after integrating to the React App

(function () {
    "use strict";

    function select(el, all = false) {
        el = el.trim()
        if (all) {
            return [...document.querySelectorAll(el)]
        } else {
            return document.querySelector(el)
        }
    }

    function on(type, el, listener, all = false) {
            if (all) {
            select(el, all).forEach(e => e.addEventListener(type,
                listener))
        } else {
            select(el, all).addEventListener(type, listener)
        }
    }

    function onscroll(el, listener) {
        el.addEventListener('scroll', listener)
    }

    /**
      * control is not going inside if condition because 
      * `select('.toggle-sidebar-btn')` is not getting called. 
      * Even on (type, el, listener, all = false) method is also
      * not invoked after integrating to React App
      */

    if (select('.toggle-sidebar-btn')) {
        on('click', '.toggle-sidebar-btn', function (e) {
            select('body').classList.toggle('toggle-sidebar')
        })
    }
})();