title: jQuery working on HTML, not in JSP
body: <p>I have a virtual keyboard package (obtained from the <a href="http://mottie.github.io/Keyboard/" rel="nofollow noreferrer">http://mottie.github.io/Keyboard/</a>) that I am trying to get working on my website.  Following their documentation, I was able to get it working on an HTML page, with the following:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="true" data-console="false" data-babel="false">
  <div class="snippet-code snippet-currently-hidden">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
   &lt;meta charset="utf-8"&gt;
   &lt;link href="http://code.jquery.com/ui/1.9.0/themes/ui-darkness/jquery-ui.css" rel="stylesheet"&gt;
   &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.js"&gt;&lt;/script&gt;
   &lt;script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"&gt;&lt;/script&gt;
   &lt;script src="http://code.jquery.com/ui/1.9.0/jquery-ui.min.js"&gt;&lt;/script&gt;
   
   &lt;link href="css/keyboard.css" rel="stylesheet"&gt;
   &lt;script src="js/jquery.keyboard.js" type="text/javascript"&gt;&lt;/script&gt;
   &lt;script&gt;
    $(function(){
     $('#keyboard').keyboard();
    });
   &lt;/script&gt;
  &lt;script type="text/javascript"&gt;
   window.onload = function() {
    var tfrow = document.getElementById('tfhover').rows.length;
    var tbRow = [];
    for (var i = 1; i &lt; tfrow; i++) {
     tbRow[i] = document.getElementById('tfhover').rows[i];
     tbRow[i].onmouseover = function() {
      this.style.backgroundColor = '#ffffff';
     };
     tbRow[i].onmouseout = function() {
      this.style.backgroundColor = '#d4e3e5';
     };
    }
   };
  &lt;/script&gt;
  &lt;title&gt;Login Page&lt;/title&gt;
  &lt;/head&gt;
  &lt;body viewsource="no"&gt;
   &lt;div id="wrap"&gt;
    &lt;input id="keyboard" type="text"&gt;
   &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>However, when the exact same content is in a file with a .jsp extension (that I encode using eclipse / spring) on a tomcat server, the jQuery doesn't work.  The only jQuery function that I have been able to run on the jsp page is to pop up an alert.</p>
  
  <p>I looked at an earlier questions <a href="https://stackoverflow.com/questions/18867220/jquery-not-working-in-jsp-page">here</a> and <a href="https://stackoverflow.com/questions/5869337/jquery-code-not-working-in-jsp-page">here</a> and <a href="https://stackoverflow.com/questions/10241789/jquery-not-loading-on-jsp-page">here</a> that I thought was similar, but didn't find anything that helped.</p>
  
  <p>Any help is appreciated by this newbie!</p>
  
  <hr>
  
  <p>Update: Including JSP code:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>&lt;%@ page language="java" contentType="text/html; charset=UTF-8"
   pageEncoding="UTF-8"%&gt;
  &lt;!DOCTYPE html&gt;
  &lt;%@page import="java.util.*"%&gt;
  &lt;%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%&gt;
  &lt;%@taglib uri="http://www.springframework.org/tags/form" prefix="form"%&gt;
  &lt;%@ taglib uri="http://www.springframework.org/security/tags"
   prefix="sec"%&gt;
  &lt;html&gt;
  &lt;head&gt;
   &lt;meta charset="utf-8"&gt;
   &lt;link href="http://code.jquery.com/ui/1.9.0/themes/ui-darkness/jquery-ui.css" rel="stylesheet"&gt;
   &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.js"&gt;&lt;/script&gt;
   &lt;script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"&gt;&lt;/script&gt;
   &lt;script src="http://code.jquery.com/ui/1.9.0/jquery-ui.min.js"&gt;&lt;/script&gt;
   
   &lt;link href="css/keyboard.css" rel="stylesheet"&gt;
   &lt;script src="js/jquery.keyboard.js" type="text/javascript"&gt;&lt;/script&gt;
   &lt;script&gt;
    $(function(){
     $('#keyboard').keyboard();
    });
   &lt;/script&gt;
  &lt;script type="text/javascript"&gt;
   window.onload = function() {
    var tfrow = document.getElementById('tfhover').rows.length;
    var tbRow = [];
    for (var i = 1; i &lt; tfrow; i++) {
     tbRow[i] = document.getElementById('tfhover').rows[i];
     tbRow[i].onmouseover = function() {
      this.style.backgroundColor = '#ffffff';
     };
     tbRow[i].onmouseout = function() {
      this.style.backgroundColor = '#d4e3e5';
     };
    }
   };
  &lt;/script&gt;
  &lt;title&gt;Login Page&lt;/title&gt;
  &lt;/head&gt;
  &lt;body viewsource="no"&gt;
   &lt;div id="wrap"&gt;
    &lt;input id="keyboard" type="text"&gt;
   &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>