title: CSS shine effect-timed
body: <p>I'm working on a button that can be activated or deactivated. When it's activated, I want a shine effect to occur every five seconds or so. I've been looking at this fiddle</p>
  
  <p><a href="http://jsfiddle.net/AntonTrollback/nqQc7/" rel="nofollow">http://jsfiddle.net/AntonTrollback/nqQc7/</a></p>
  
  <p>and have attempted to redesign it so that the div around my button will be toggled with the class "icon-effect", creating the shine effect, and then toggled off after about a second, and then it'll do that every five seconds. I edited the fiddle to create the div </p>
  
  <pre><code>&lt;div id = 'my_button_div&gt;
  &lt;div&gt;
  </code></pre>
  
  <p>and gave various properties to make a red box, essentially. Then, I left the icon effect class as the fidde has it, and ran a time function</p>
  
  <pre><code>setInterval(function () {
                  $('#my_ button_div').toggleClass('icon-effect');
                  setTimeout(function () {
                       $('#my_ button_div').toggleClass('icon-effect');
                  }, 1000);
              }, 5000);
  </code></pre>
  
  <p>this is the fiddle </p>
  
  <p><a href="http://jsfiddle.net/nqQc7/286/" rel="nofollow">http://jsfiddle.net/nqQc7/286/</a></p>
  
  <p>but I can't seem to get it to work. I left the hover stuff there, but it should just trigger a shine effect at those allotted times. </p>