Javascript 将Vanilla JS与jQuery混合，获取变量未定义错误

非常糟糕的情况是，我不得不将新代码嵌入到一些非常旧的代码中，为了让它正常工作，我不得不内联一些jQuery和一些普通的JS。现在jQuery运行良好（这是一个胜利），但是当调用vanilla JS时，会给出

未捕获引用错误：未定义重置

未捕获引用错误：未定义检查答案

我试图从控制台执行jq.reset（），但这仍然没有定义

这是内联JS

<script type='text/javascript'>  
            var jq = jQuery.noConflict(true);  

            (function ($) {

            $(document).ready(function () {    

            /* Drag and Drop */
            //var container = document.getElementById("health");
            //var content = container.innerHTML;

            var correctAnswers = [
              "fish and seafood",
              "meat and small goods",
              "poultry and game",
              "dairy and egg-based foods",
              "wet dishes, soups, stock and sauces",
              "fruits including rock melon, watermelon, blueberries and fruit salad",
              "pre-made salads",
              "pate and soft cheeses",
              "ice-cream",
              "cooked rice and pasta"
            ];
            var answers = [];

            function checkAnswers() {
              correctAnswers.sort();
              answers.sort();
              var result = true;

              if (correctAnswers.length !== answers.length) {
                result = false;
                $("#incomplete").show();
              } else if (correctAnswers.length == answers.length) {
                for (var i = correctAnswers.length; i--; ) {
                  if (correctAnswers[i] !== answers[i]) {
                    result = false;
                    $("#incomplete").hide();
                    $("#incorrect").show();
                  }
                }
              }

              if (result) {
                $("#incorrect").hide();
                $("#incomplete").hide();
                $("#correct").show();
              }
            }

            function allowDrop(ev) {
              ev.preventDefault();
            }

            function drag(ev) {
              ev.dataTransfer.setData("text", ev.target.id);
            }

            function drop(ev) {
              ev.preventDefault();
              var data = ev.dataTransfer.getData("text");
              answers.push(data);
              console.log(correctAnswers);
              console.log(answers);
              ev.target.appendChild(document.getElementById(data));
            }

            function dropOut(ev) {
              ev.preventDefault();
              var data = ev.dataTransfer.getData("text");
              var index = answers.indexOf(data);
              answers.splice(index, 1);
              console.log(correctAnswers);
              console.log(answers);
              ev.target.appendChild(document.getElementById(data));
            }

            function reset() {
              var container = document.getElementById("health");
              container.innerHTML = html;
              answers = [];
              document.getElementById(".dropable-area").reset();
            }

            if ($('#health').length){
                var html;
                window.onload = function() {
                    html = document.getElementById("health").innerHTML;
                }; 
            }

            $("#health").on("click",".correctKey",function() {
              $("#health").find(".dropbox").each(function(index) {
                $(this).text(correctAnswers[index]);
                answers = correctAnswers;
              });
            });

          });
        }(jq));
        </script>

var jq=jQuery.noConflict（true）；
（函数（$）{
$（文档）.ready（函数（）{
/*拖放*/
//var container=document.getElementById（“健康”）；
//var content=container.innerHTML；
var更正答案=[
“鱼和海鲜”，
“肉类和小商品”，
“家禽和野味”，
“乳制品和蛋类食品”，
“湿菜、汤、汤和酱汁”，
“水果包括甜瓜、西瓜、蓝莓和水果沙拉”，
“预制沙拉”，
“肉酱和软奶酪”，
“冰淇淋”，
“米饭和意大利面”
];
var回答=[]；
函数checkAnswers（）{
正确答案。排序（）；
答案：sort（）；
var结果=真；
if（correctAnswers.length！==answers.length）{
结果=假；
$（“#不完整”）.show（）；
}else if（correctAnswers.length==answers.length）{
for（var i=correctAnswers.length；i--；）{
如果（正确答案[i]！==答案[i]）{
结果=假；
$（“#不完整”）.hide（）；
$（“#不正确”）.show（）；
}
}
}
如果（结果）{
$（“#不正确”）.hide（）；
$（“#不完整”）.hide（）；
$（“#正确”）.show（）；
}
}
功能allowDrop（ev）{
ev.preventDefault（）；
}
功能阻力（ev）{
ev.dataTransfer.setData（“文本”，ev.target.id）；
}
功能下降（ev）{
ev.preventDefault（）；
var data=ev.dataTransfer.getData（“文本”）；
答案。推送（数据）；
控制台日志（正确答案）；
控制台日志（应答）；
ev.target.appendChild（document.getElementById（数据））；
}
功能丢失（ev）{
ev.preventDefault（）；
var data=ev.dataTransfer.getData（“文本”）；
var指数=答案.indexOf（数据）；
答案：拼接（索引1）；
控制台日志（正确答案）；
控制台日志（应答）；
ev.target.appendChild（document.getElementById（数据））；
}
函数重置（）{
var container=document.getElementById（“健康”）；
container.innerHTML=html；
答案=[]；
document.getElementById（“.dropable area”）.reset（）；
}
如果（$（“#健康”）。长度）{
var-html；
window.onload=函数（）{
html=document.getElementById（“健康”）.innerHTML；
}; 
}
$（“#运行状况”）。在（“单击”，“.correctKey”，函数（）上{
$（“#健康”）.find（“.dropbox”）.each（函数（索引）{
$（此）.text（更正答案[索引]）；
答案=正确答案；
});
});
});
}(jq);；

调用它的HTML、带有reset（）和checkAnswers（）的按钮都失败了，我想把它剥离出来，放在一个单独的脚本中，但是它还有jQuery，需要对它进行包装，以保护它的版本不受文件中使用的旧版本的影响

<div class="container drag" id="health">
  <div class="row dropable-area">
    <div class="col-sm-12">
      <div class="row">
        <div class="col-sm-6">
          <div class="dropbox panel panel-default" ondrop="drop(event)" ondragover="allowDrop(event)">
          </div>
        </div>
        <div class="col-sm-6">
          <div class="dropbox panel panel-default" ondrop="drop(event)" ondragover="allowDrop(event)">
          </div>
        </div>
        <div class="col-sm-6">
          <div class="dropbox panel panel-default" ondrop="drop(event)" ondragover="allowDrop(event)">
          </div>
        </div>
        <div class="col-sm-6">
          <div class="dropbox panel panel-default" ondrop="drop(event)" ondragover="allowDrop(event)">
          </div>
        </div>
        <div class="col-sm-6">
          <div class="dropbox panel panel-default" ondrop="drop(event)" ondragover="allowDrop(event)">
          </div>
        </div>
        <div class="col-sm-6">
          <div class="dropbox panel panel-default" ondrop="drop(event)" ondragover="allowDrop(event)">
          </div>
        </div>
        <div class="col-sm-6">
          <div class="dropbox panel panel-default" ondrop="drop(event)" ondragover="allowDrop(event)">
          </div>
        </div>
        <div class="col-sm-6">
          <div class="dropbox panel panel-default" ondrop="drop(event)" ondragover="allowDrop(event)">
          </div>
        </div>
        <div class="col-sm-6">
          <div class="dropbox panel panel-default" ondrop="drop(event)" ondragover="allowDrop(event)">
          </div>
        </div>
        <div class="col-sm-6">
          <div class="dropbox panel panel-default" ondrop="drop(event)" ondragover="allowDrop(event)">
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="row answers-area">
    <div class="col-sm-12">
      <div class="panel panel-default answers">
        <div class="panel-body" ondrop="dropOut(event)">
          <div class="row">
            <div class="col-md-4">
              <p class="answer" draggable="true" ondragstart="drag(event)" id="fish and seafood">fish and seafood</p>
              <p class="answer" draggable="true" ondragstart="drag(event)" id="meat and small goods">meat and small goods</p>
              <p class="answer" draggable="true" ondragstart="drag(event)" id="packets of dry food">packets of dry food</p>
              <p class="answer" draggable="true" ondragstart="drag(event)" id="poultry and game">poultry and game</p>
              <p class="answer" draggable="true" ondragstart="drag(event)" id="wet dishes, soups, stock and sauces">wet dishes, soups, stock and sauces</p>
            </div>
            <div class="col-md-4">
              <p class="answer" draggable="true" ondragstart="drag(event)" id="dairy and egg-based foods">dairy and egg-based foods</p>
              <p class="answer" draggable="true" ondragstart="drag(event)" id="pre-made salads">pre-made salads</p>
              <p class="answer" draggable="true" ondragstart="drag(event)" id="raw vegetables">raw vegetables</p>
              <p draggable="true" ondragstart="drag(event)" id="pate and soft cheeses">pate and soft cheeses</p>
            </div>
            <div class="col-md-4">
              <p class="answer" draggable="true" ondragstart="drag(event)" id="uncooked rice and pasta">uncooked rice and pasta</p>
              <p class="answer" draggable="true" ondragstart="drag(event)" id="ice-cream">ice-cream</p>
              <p class="answer" draggable="true" ondragstart="drag(event)" id="cooked rice and pasta">cooked rice and pasta</p>

              <p class="answer" draggable="true" ondragstart="drag(event)" id="fruits including rock melon, watermelon, blueberries and fruit salad">fruits including rock melon, watermelon, blueberries and fruit salad</p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="row bottom-area">
    <div class="col-md-12">
      <div class="buttons">
        <button class="btn btn-default" onclick="checkAnswers()">Check Answers</button>
        <button class="btn btn-default correctKey">Answer Key</button>
        <button class="btn btn-default" onclick="reset()">Reset</button>
      </div>
      <div class="messages">
        <div class="alert alert-success" id="correct" style="display:none;">
        <p><strong>Well done!</strong> You successfully identified the hazards!</p>
        </div>
        <div class="alert alert-warning" id="incomplete" style="display:none;">
          <p><strong>Warning!</strong> You havn't finished identifying all the hazards.</p>
        </div>
        <div class="alert alert-danger" id="incorrect" style="display:none;">
          <p><strong>Oh snap!</strong> It doesn't look like you have the correct hazards identified!</p>
        </div>
      </div>
    </div>
  </div>

鱼和海鲜

肉类和小商品
干粮包装
家禽和野味
湿菜、汤、汤和酱汁
乳制品和蛋基食品
预制沙拉
生蔬菜
头和软奶酪
生米和面食
冰淇淋