How can I conditionally set a div's class in jQuery?
<h3>CSS:</h3>

<pre><code>   #outer{
    background-color:#FFFF99;      
   }

   #inner1{
      float : left;
   }

    .New1{
      width: 62%; 
    }

   .New2{
     width: 72% 
   }
</code></pre>

<p><hr /></p>

<p>I need to be able to change the class of a <code>div</code> after a condition in an event handler.</p>

<h3>Logic:</h3>

<pre><code>         case '1': &lt;div id="outer" class="New1"&gt; 
                   &lt;/div&gt;
         case '2': &lt;div id="outer" class="New2"&gt;
                    &lt;/div&gt;
</code></pre>

<p><hr /></p>

<p>To do this, I wrote the following jQuery:</p>

<pre><code>$("#generate").click(function(){
     // here I wrote code for case '1'
     $("#outer").addClass("New1");
});
$("#choice").click(function(){
     // here I wrote code for case '2'
     $("#outer").addClass("New2");
});
</code></pre>

<ul>
<li><p>Do I need to remove the class that I previously added to it?</p></li>
<li><p>I need to toggle between two states. </p></li>
</ul>

<p>How can I do this?</p>
