title: how to handle two processes in jQuery
body: <p>The following code only handles the script which contain <strong>setInterval</strong> and the other script is unreachable.</p>
  <p>What should I do to handle both scripts?</p>
  <pre><code>&lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;Top News&lt;/title&gt;
      &lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=UTF-8&quot;&gt;
      &lt;script type=&quot;text/javascript&quot; src=&quot;jquery/jquery-1.5.2.js&quot;&gt;&lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
      &lt;div class=&quot;top-new-content&quot;&gt;
          &lt;div class=&quot;one&quot; style=&quot;position: absolute; left: 10px; top: 10px; background:yellow;width:300px;height:100px; border: 1px #979797 solid&quot;&gt;
              &lt;img src=&quot;image/news/img.jpg&quot; width=&quot;100px&quot; height=&quot;50px&quot; /&gt;
          &lt;/div&gt;
          &lt;div class=&quot;two&quot; style=&quot;position: absolute; left: 10px; top: 10px;background:yellow;width:300px;height:100px; border: 1px #979797 solid&quot;&gt;
              two two two two two two two ...
          &lt;/div&gt;
          &lt;div class=&quot;three&quot; style=&quot;position: absolute; left: 10px; top: 10px; background:yellow;width:300px;height:100px; border: 1px #979797 solid&quot;&gt;
              three three three three three ...
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class=&quot;top-news-category&quot; style=&quot;position: absolute; left: 10px; top: 111px; border: 1px #979797 solid; border-top: none; background-color: yellow&quot;&gt;
          &amp;nbsp;&lt;span id=&quot;a&quot;&gt;One |&lt;/span&gt;
          &lt;span id=&quot;b&quot;&gt;Two |&lt;/span&gt;
          &lt;span id=&quot;c&quot;&gt;Three&lt;/span&gt;&amp;nbsp;
      &lt;/div&gt;
  &lt;/body&gt;
  
  &lt;script type=&quot;text/javascript&quot;&gt;
      $(document).ready(function(){
          setInterval(function() {
              $('div.one').fadeIn(1000);
              $('div.two').fadeOut(1000);
              $('div.three').fadeOut(1000);
              $(&quot;*&quot;).delay(3000);
              $('div.two').fadeIn(1000);
              $('div.one').fadeOut(1000);
              $('div.three').fadeOut(1000);
              $(&quot;*&quot;).delay(3000);
              $('div.three').fadeIn(1000);
              $('div.one').fadeOut(1000);
              $('div.two').fadeOut(1000);
              $(&quot;*&quot;).delay(3000);
          }, 0);
      });
  &lt;/script&gt;
  
  &lt;script type=&quot;text/javascript&quot;&gt;
      $(document).ready(function(){
          $(&quot;.top-news-category #a&quot;).click(function(){
              $(&quot;div.one&quot;).fadeIn(&quot;slow&quot;, &quot;linear&quot;);
              $(&quot;div.two&quot;).fadeOut(&quot;slow&quot;, &quot;linear&quot;);
              $(&quot;div.three&quot;).fadeOut(&quot;slow&quot;, &quot;linear&quot;);
          });
          $(&quot;.top-news-category #b&quot;).click(function(){
              alert(&quot;TWO&quot;);
              $(&quot;div.one&quot;).fadeOut(&quot;slow&quot;, &quot;linear&quot;);
              $(&quot;div.three&quot;).fadeOut(&quot;slow&quot;, &quot;linear&quot;);
              $(&quot;div.two&quot;).fadeIn(&quot;slow&quot;, &quot;linear&quot;);
          });
          $(&quot;.top-news-category #c&quot;).click(function(){
              $(&quot;div.one&quot;).fadeOut(&quot;slow&quot;, &quot;linear&quot;);
              $(&quot;div.three&quot;).fadeOut(&quot;slow&quot;, &quot;linear&quot;);
              $(&quot;div.three&quot;).fadeIn(&quot;slow&quot;, &quot;linear&quot;);
          });
      });
  &lt;/script&gt;
  </code></pre>