How do I correct the below JS code?

Question

One of the Projects I am working on, I am implementing how to hide certain document libraries based on a change in a metadata choice column. I wanted to test this out once I completed coding and which is why I put it into a SharePoint script editor web part but for some reason after inserting the code inside script editor web part, it appears as of a random text, Please see below screenshots.

I just don't understand what's wrong here, the JS code is written between the beginning and ending script tags. Also I have Jquery reference in the code. Can someone help me if I am doing something wrong in terms of Syntax, maybe an extra parenthesis or comma. I checked it thoroughly but can't find the mistake. Thanks in advance. Below is the code I wrote. I am working with Office 365/SharePoint online.

<script type="text/javascript">
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>

var itemID = null;
var siteurl= null;

$(document).ready(function() {  
$("input[title='Stage']").change(function() {  
if($("select[title='Stage']").val()== "Property") {

            var itemID = document.getElementById("Stage");
        alert("ItemID:",itemID);
        getURL(itemID);
        hideLibrary(siteurl);
  }

if($("select[title='Stage']").val()== "Development") {
        var itemID = document.getElementById();
        getURL(itemID);
        showLibrary(siteurl);
  }

if($("select[title='Stage']").val()== "Transition") {
        var itemID = document.getElementById();
        getURL(itemID);
        showLibrary(siteurl);
  }

});  
});

var currentcontext = null;
var currentweb = null;



function hideLibrary(siteurl)
{
  var ctx = new SP.ClientContext().get_current(siteurl);

  var acq= ctx.get_web().get_lists().getByTitle('Acquisition');
  acq.set_hidden(true);
  acq.update();

  var app= ctx.get_web().get_lists().getByTitle('Approvals');
  app.set_hidden(true);
  app.update();

  ctx.load(acq);
  ctx.load(app);

  ctx.executeQueryAsync(function(){

  });
}

function showLibrary(siteurl)
{   
  var ctx = new SP.ClientContext().get_current(siteurl);

  var acq= ctx.get_web().get_lists().getByTitle('Acquisition');
  acq.set_hidden(false);
  acq.update();

  var app= ctx.get_web().get_lists().getByTitle('Approvals');
  app.set_hidden(false);
  app.update();

  ctx.load(acq);
  ctx.load(app);

  ctx.executeQueryAsync(function(){



  });
}

function getURL(itemID)
{
    var ctx = SP.ClientContext.get_current();
    var listItem = ctx.get_web().get_lists().getByTitle('Asset List').getItemById(itemID);
    ctx.load(listItem);
    var siteurl = listItem.get_item("Asset Link").get_url();
    alert("siteurl:",siteurl);
    ctx.executeQueryAsync(function () {

        });
        function (sender, args) { alert(args.get_message()); }
        );
    return siteurl;

}

function onQuerySucceeded(sender, args)  
{  
   alert('Title: ' + this.oWebsite.get_title() + ' Description: ' + this.oWebsite.get_description());  
}  

function onQueryFailed(sender, args)   
{  
   alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());  
}  

</script>

Answer 1

I believe your reference to jQuery should be outside of your other script block.

So:

<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>

<script type="text/javascript">

  // all your other script here

</script>