Add an Open and Close button to Chatbox in Microsoft Bot Framework Widget

Question

I am trying to add a button to my chatbot so it can be opened (started) and closed, but I am struggling to add it into the chatbot area, also I am not sure if it will even work as I can't test it. Apologies if this is simple to solve but I am a bit of a novice here.

My widget code is as follows:

<div
  class="chat-popup"
  id="webchat"
  role="main"
  style="height: 30%; width: 15%; margin-top: 5%; margin-left: 10%"
>
  <span class="close_div" onclick="close_div(1)">✖</span>
</div>

<script
  src="https://omnireach.net/webchat?key=PbjMaijC3EKXWii/ANCiHQ=="
  type="text/javascript"
></script>

<script>
  window.onload = function () {
    var styleOptions = {
      hideUploadButton: false,
      bubbleFromUserBackground: "lightblue",
      sendBoxButtonColor: "red",
      typingAnimationDuration: 5000,
      typingAnimationHeight: 20,
      typingAnimationWidth: 64,
      timestampColor: undefined,
      timestampFormat: "relative",
      botAvatarImage:
        "https://zincgroupdevelopment.com/wp-content/uploads/2021/06/Talk-to-us-1.png",
    };

    orWebChat.start(styleOptions, "webchat");
  };

  function close_div(id) {
    if (id === 1) {
      jQuery("#webchat").hide();
    }
  }
</script>