title: How to make background color of div tag keep changing using JQuery?
body: <p>I am trying to change background of div tag continuously using for loop and rgb() values .
  following is my code written in sample.html:</p>
  
  <pre><code>    &lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
      &lt;head&gt;
          &lt;title&gt;sample&lt;/title&gt;
          &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"&gt;
          &lt;/script &gt;
          &lt;script&gt;
          $(document).ready(function(){
              var r=0;
              var g=0;    
              var b=0;
  
              for(r=0;r&lt;255;r++)
              {
                  for(g=0;g&lt;255;g++)
                  {
                      for(b=0;b&lt;255;b++)
                      {
                          $("#sqr").css("background-color","rgb(r,g,b)");
                      }
                  }
              }
          });
  
          &lt;/script&gt;
  
  
          &lt;style&gt;
          #sqr{background-color:rgb(255,0,0);
               height:200px;
                width:200px;
              }
          &lt;/style&gt;
  
      &lt;/head&gt;
      &lt;body&gt;
  
      &lt;div id="sqr"&gt;
      &lt;/div&gt;
  
      &lt;/body&gt;
      &lt;/html&gt;
  </code></pre>
  
  <p>so can enyone tell me how should i make a code so that  background color of div keeps changing automatically when page is loaded ?
  Note that i want to change color very smoothly.</p>
  
  <p>If you want to  see how effects i want then visit:<a href="http://www.designweekportland.com/" rel="nofollow noreferrer">here</a> and see effects its showing.</p>
  
  <p>As per some suggestions I have changed my code to:</p>
  
  <pre><code>$("#sqr").css("background-color","rgb("+r+","+g+","+b+")");
  </code></pre>
  
  <p>Now it is taking values of rgb correctly ,but not loading  effects correctly in browser,shows me dialog box:</p>
  
  <p><img src="https://i.stack.imgur.com/LGqTL.png" alt="Dialog Box"></p>