title: Android Webview Uncaught ReferenceError: $ is not defined
body: <p>I would like to  display simple Bootstrap table suing Jquery in Webview.</p>
  
  <p>Works fine on desktop browser, but in Chrome debugger of the webview is it throwing the following exception.</p>
  
  <pre><code>Android Webview Uncaught ReferenceError: $ is not defined
  </code></pre>
  
  <p>Webview is set by the following way:</p>
  
  <pre><code>public void setWebview() {
      try {
          AssetManager mgr = getBaseContext().getAssets();
          mWebView = (WebView) findViewById(R.id.intro_browser);
  
          InputStream in = mgr.open("www/table.html", AssetManager.ACCESS_BUFFER);
          String htmlContentInStringFormat = StreamToString(in);
          in.close();
  
          // Set Chrome instead of the standard WebView
          mWebView.setWebChromeClient(new WebChromeClient());
          mWebView.getSettings().setJavaScriptEnabled(true);
              mWebView.getSettings().setAllowFileAccessFromFileURLs(true);
              mWebView.getSettings().setAllowUniversalAccessFromFileURLs(true);
          mWebView.clearCache(true);
          mWebView.clearHistory();
          mWebView.getSettings().setAllowContentAccess(true);
          mWebView.getSettings().setBlockNetworkImage(false);
          mWebView.loadDataWithBaseURL(null, htmlContentInStringFormat, "text/html", "utf-8", null);
      } catch (Exception e) {
          Log.d("TEST", e.getMessage());
      }
  
      }
  </code></pre>
  
  <p>And HTML in the assets/www folder is the following:</p>
  
  <pre><code>&lt;html lang="en"&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
      &lt;title&gt;Table Fixed Header&lt;/title&gt;
      &lt;!-- Latest compiled and minified CSS --&gt;
      &lt;link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css"&gt;
  
      &lt;!-- Optional theme --&gt;
      &lt;link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap-theme.min.css"&gt;
  
      &lt;!-- Latest compiled and minified JavaScript --&gt;
      &lt;script src="bower_components/jquery/src/jquery-2.1.4.min.js"&gt;&lt;/script&gt;
  
      &lt;!-- Latest compiled and minified JavaScript --&gt;
      &lt;script src="bower_components/bootstrap/dist/js/bootstrap.min.js"&gt;&lt;/script&gt;
  
  
      &lt;style&gt;
          .table-responsive&gt;.fixed-column {
            position: absolute;
            display: inline-block;
            width: auto;
            border-right: 1px solid #ddd;
          }
          @media(min-width:768px) {
            .table-responsive&gt;.fixed-column {
              display: none;
            }
          }
  
          /*Heading */
  
      &lt;/style&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div class="table-responsive"&gt;
      &lt;table class="table table-striped table-bordered table-hover table-condensed header-fixed"&gt;
          &lt;thead&gt;
          &lt;tr&gt;
              &lt;th&gt;#&lt;/th&gt;
              &lt;th&gt;Table heading&lt;/th&gt;
              &lt;th&gt;Table heading&lt;/th&gt;
              &lt;th&gt;Table heading&lt;/th&gt;
              &lt;th&gt;Table heading&lt;/th&gt;
              &lt;th&gt;Table heading&lt;/th&gt;
              &lt;th&gt;Table heading&lt;/th&gt;
          &lt;/tr&gt;
          &lt;/thead&gt;
          &lt;tbody&gt;
          &lt;tr&gt;
              &lt;td&gt;3&lt;/td&gt;
              &lt;td&gt;Table cell&lt;/td&gt;
              &lt;td&gt;Table cell&lt;/td&gt;
              &lt;td&gt;Table cell&lt;/td&gt;
              &lt;td&gt;Table cell&lt;/td&gt;
              &lt;td&gt;Table cell&lt;/td&gt;
              &lt;td&gt;Table cell&lt;/td&gt;
          &lt;/tr&gt;
          &lt;/tbody&gt;
      &lt;/table&gt;
  &lt;/div&gt;
  &lt;script&gt;
  $( document ).ready(function() {
      console.log( "ready!" );
      var $table = $('.table');
      var $fixedColumn = $table.clone().insertBefore($table).addClass('fixed-column');
  
      $fixedColumn.find('th:not(:first-child),td:not(:first-child)').remove();
  
      $fixedColumn.find('tr').each(function (i, elem) {
        $(this).height($table.find('tr:eq(' + i + ')').height());
      });
  
      //ALert is not called in the Webview
      alert("TEST");
  });
  
      &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>How can i solve it please? Many thanks for any advice. </p>