title: Site works fine on localhost but doesnot respond calculations on hosting server
body: <p>I have created simple conversion form that takes input from user and calculate the result without pressing button. My problem is that it works fine on localhost but when I upload it on free hosting site it doesn't respond with calculations. JQuery also doesn't work when I press the div on the top left of my form it highlights on local but not when I upload Please help.</p>
  
  <p>Here is my index.html </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
      &lt;meta charset="UTF-8"&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
      &lt;title&gt;Document&lt;/title&gt;
      &lt;script src="http://code.jquery.com/jquery-1.11.1.min.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;!-- &lt;script type="text/javascript"&gt;
      $("document").ready(function(e){
          $("input").change(function(){
              var total=0;
              $("input[name=qww]").each (function(){
                  total=10*parseInt($(this).val());
  
              })
              $("input[name=long]").val(total);
             
          });
      });
              
      &lt;/script&gt; --&gt;
     
  &lt;style type="text/css"&gt;
  .main{
  
      height:400px;
      width: 300px;
      background-color: white;
      margin: 100px 100px 100px 100px;
      border-radius: 10px;
  }
  #compare{
      height: 50px;
      width: 147px;
      background-color: white;
      border-right-style: solid;
      border-right-color: orange;
      float: left;
     
     
  
  }
  #compare2{
      height: 50px;
      width: 150px;
      background-color: white ;
      float: right;
      
  
  }
  #compare4{
     
      height: 35px;
      width: 147px;
      background-color: white;
      border-right-style: solid;
      border-right-color: orange;
      float: left;
     
     
  
  }
  #compare5{
      
      height: 35px;
      width: 150px;
      background-color: white ;
      float: right;
      
  
  }
  .form{
  
  height: 150px;
  width: 300px;
  background-color: white;
  float: left;
  margin-top: 10px;
  margin-bottom: 10px;
  }
  .Myform{
  padding: 5px 0;
  
  
  }
  input[type=text]{
      width: 70px;
      height: 30px;
      font-style: oblique;
      font-size: 18px;
     outline: none;
     border: none;
     font-weight:bolder;
  
  }
  .qwerty{
      height: 20px;
      width: 300px;
      background-color: rgb(122, 16, 122);
      color: blue;
  }
  .button{
      margin-top: 20px;
      margin-left: 0px;
      width: 300px;
      height: 40px;
      background-color: blue;
      color: white;
      font-size: 18px;
      text-align: center;
      border-radius: 10px;
      -WEbkit-box-shadow: 3px 3px 3px #ccc;
      font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
  }
  .text{
      margin-top: 5px;
      background-color: rgb(255, 255, 255);
      height: 60px;
      border-radius: 5px;
      
      -WEbkit-box-shadow: 3px 3px 3px #ccc;
  }
  .initial{
      height: 15px;
      margin-top: 50px;
     
      width: 147px;
      background-color: white;
      border-right-style: solid;
      border-right-color: orange;
       }
       .image{
  
           width: 40px;
           height: 15px;
           margin-left: 10px;
       }
       img{
           vertical-align: top;
       }
       .highLight{
      background-color: #333333;
  }
  .panel{
      -webkit-transition:0.3s;
      transition:0.3s;
      opacity:1;
  }
  .panel:not(.highLight){
      opacity:0.5;
  }
  &lt;/style&gt;
  &lt;body&gt;
      &lt;div class="main"&gt;
          &lt;div class="initial" style="float: left; font-size: 10px; text-align: center; color: blue;"  &gt;
          COMPARE&lt;/div&gt;
          &lt;div class="initial" style="float: right;font-size: 10px; text-align: center; color: blue;"&gt;
          VENTA&lt;/div&gt;
          &lt;div class="panel" id="compare"style="font-size: 26px;font-weight: bolder; text-align: center;color: black;"&gt;3.4000
  
          &lt;/div&gt;
          &lt;div class="panel" id="compare2"style="font-size: 26px;font-weight: bolder; text-align: center;color: black;"&gt;3.4306
  
          &lt;/div&gt;
          
          &lt;div class="form"&gt;
              
             &lt;div class="text"&gt;
              &lt;div class="QWERTY" style="font-size: 10px; text-align: right;color: blue;"&gt;
                  VENTA&lt;/div&gt;
                 
                 
                 &lt;form id="bbb" action="index.html" class="Myform" style="font-size: 10px; font-weight: bold;"&gt;USD
                  &lt;label for="" style="font-size: 30px;"&gt;&amp;nbsp;$&lt;/label&gt; 
                     &lt;input type="text" class='qww' placeholder="1000" style="float: right;"&gt;
                 &lt;/form&gt;
             &lt;/div&gt;
             &lt;div class="image"&gt;
            &lt;a href="www.google.com"&gt;&lt;img src="images.jpg" alt="" style="margin-left: 50px; width: 40px;object-position:right; height: 45px;"&gt; 
            &lt;/a&gt;  
          &lt;/div&gt;
             &lt;div class="text" &gt;
              &lt;div class="QWERTY" style="font-size: 10px; text-align: right; color: blue;"&gt;
                  VENTA&lt;/div&gt;
              &lt;form  action="index.html" class="Myform" style="font-size:  10px;"&gt;PEN
                  &lt;label for="" style="font-size: 30px; font-weight: bold;"&gt;&amp;nbsp;S/&lt;/label&gt;
                  &lt;input type="text" id='long' placeholder="3400" style="float: right;" disabled&gt;
              &lt;/form&gt;
              &lt;button class="button" value="compare"&gt;&lt;a href="form.html"&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&lt;/a&gt;&lt;/button&gt;
          &lt;/div&gt;
         
             
              
          &lt;/div&gt;   
          &lt;div class="initial" style="float: left; font-size: 10px; text-align: center;"  &gt;
              &lt;/div&gt;
              &lt;div class="initial" style="float: right;font-size: 10px; text-align: center;"&gt;
              VENTA&lt;/div&gt;
          &lt;div  id="compare4"style="font-size: 30px;font-weight: bolder; text-align: right;color: blue;"&gt;
              
          &lt;/div&gt;
          &lt;div id="compare5"style="font-size:12px; text-align: center;color: black;"&gt;
              &lt;h4&gt; S/ 54.70&lt;/h4&gt;
  
          &lt;/div&gt;
          
      &lt;/div&gt;
      &lt;script&gt;
          // we used jQuery 'keyup' to trigger the computation as the user type
          $('.qww').keyup(function () {
           
              // initialize the sum (total price) to zero
              var sum = 0;
               
              // we use jQuery each() to loop through all the textbox with 'price' class
              // and compute the sum for each loop
              $('.qww').each(function() {
                  sum =10* Number($(this).val());
              });
               
              // set the computed value to 'totalPrice' textbox
              $('#long').val(sum);
               
          });
          $('.panel').hover(function(){
          $(this).toggleClass('highLight');
  });
          &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  
         </code></pre>
  </div>
  </div>
  </p>