jQuery addClass example

Change class name on click in jQuery

by Yuriy Bablyukh

HTML

<script src="http://localhost:8080/jasperserver-pro/client/visualize.js?_opt=true"></script>

<div class="container" style="width: 95%">
  <button class="btn btn-default margin_bottom" id="btnLogger">check logger</button>
  <button class="btn btn-default margin_bottom" id="btn_classUtils">check classUtils</button>
  <button class="btn btn-default margin_bottom" id="btn__arr">check _arr</button>
  <button class="btn btn-default margin_bottom" id="btn_minPos">check minPos</button>
  <button class="btn btn-default margin_bottom" id="btn_maxPos">check maxPos</button>
  <button class="btn btn-default margin_bottom" id="btn_AdhocDataProcessor">check AdhocDataProcessor</button>
  <button class="btn btn-default margin_bottom" id="btn_hcDefaultPalette">check hcDefaultPalette</button>
  <button class="btn btn-default margin_bottom" id="btn_hcDateTimeFormats">check hcDateTimeFormats</button>
  <button class="btn btn-default margin_bottom" id="btn_adhocToHighchartsTypes">check adhocToHighchartsTypes</button>
  <button class="btn btn-default margin_bottom" id="btn_highchartsDataMapper">check highchartsDataMapper</button>
  <button class="btn btn-default margin_bottom" id="btn_AdhocHighchartsAdapter">check AdhocHighchartsAdapter</button>
  <button class="btn btn-default margin_bottom" id="btn_it">check it</button>
  <button class="btn btn-default margin_bottom" id="btn_Highcharts">check Highcharts</button>
  <button class="btn btn-default margin_bottom" id="btn_HighchartsAdapter">check HighchartsAdapter</button>
  <button class="btn btn-default margin_bottom" id="btn__">check _</button>
  <button class="btn btn-default margin_bottom" id="btn_jasper">check jasper</button>
  <button class="btn btn-default margin_bottom" id="btn_JQ">check $</button>
  <button class="btn btn-default margin_bottom" id="btn_Backbone">check Backbone</button>
  <button class="btn btn-default margin_bottom" id="btn___jrsConfigs__">check __jrsConfigs__</button>
</div>
<br/>

<div class="span5">

  <ol...

JavaScript

Object.keys(window).forEach(function(value) {
   var node = document.createElement("LI");
   var textnode = document.createTextNode(value);
   node.appendChild(textnode);
   document.getElementById("test1").appendChild(node);
 });

 visualize({
   auth: {
     name: "superuser",
     password: "superuser"
   }
 }, function(v) {
 
 console.log("Visualize loaded");

   Object.keys(window).forEach(function(value) {
     var node = document.createElement("LI");
     var textnode = document.createTextNode(value);
     node.appendChild(textnode);
     document.getElementById("test2").appendChild(node);
   });

   $("#btnLogger").click(
     function() {
       if (typeof logger === 'undefined') {
         alert("logger missing");
       } else {
         alert("Variable present, please log a bug!");
       }
     }
   );

   $("#btn_classUtils").click(
     function() {
       if (typeof classUtils === 'undefined') {
         alert("classUtils missing");
       } else {
         alert("Variable present, please log a bug!");
       }
     }
   );

   $("#btn__arr").click(
     function() {
       if (typeof _arr === 'undefined') {
         alert("_arr missing");
       } else {
         alert("Variable present, please log a bug!");
       }
     }
   );

   $("#btn_minPos").click(function() {
     if (typeof minPos === 'undefined') {
       alert("minPos missing");
     } else {
       alert("Variable present, please log a bug!");
     }
   });

   $("#btn_maxPos").click(function() {
     if (typeof maxPos === 'undefined') {
       alert("maxPos missing");
     } else {
       alert("Variable present, please log a bug!");
     }
   });

   $("#btn_AdhocDataProcessor").click(function() {
     if (typeof AdhocDataProcessor === 'undefined') {
       alert("AdhocDataProcessor missing");
     } else {
       alert("Variable present, please log a bug!");
     }
   });

   $("#btn_hcDefaultPalette").click(function() {
     if (typeof hcDefaultPalette === 'undefined') {
      ...