title: How to add a image to the default selected JQuery tab by adding a class?
body: <p>I have a jQuery tab, where I need to add an image.</p>
  <p><img src="https://i.stack.imgur.com/L4R18.png" alt="Tab over" /></p>
  <p>So When a tab is selected it looks like
  <img src="https://i.stack.imgur.com/Tl031.jpg" alt="enter image description here" /></p>
  <p>This is being achieved by the following code:</p>
  <pre><code>        $(&quot;.ui-state-active&quot;).css(&quot;background-image&quot;, &quot;url('/Content/images/tab-over.png')&quot;);
          $('#tabs .tab-menu li a').click(function() {
              $('#tabs .tab-menu li').css(&quot;background-image&quot;, &quot;none&quot;);
              $(this).parent().css(&quot;background-image&quot;, &quot;url('/Content/images/tab-over.png')&quot;);
          });
  </code></pre>
  <p>It works fine expect that in the first line of code I want to remove that class (<strong>.ui-state-active</strong>) and add my own class. How can that be done ? Here is my tab code:</p>
  <pre><code>&lt;ul class=&quot;tab-menu&quot;&gt;
          &lt;li&gt;&lt;a href=&quot;&lt;%= Url.Action(&quot;GetCoreTab&quot;, &quot;Tab&quot;) %&gt;&quot; class=&quot;a&quot;&gt;&lt;b&gt;
              &lt;div id=&quot;home&quot; class=&quot;menu&quot;&gt;
              &lt;/div&gt;
          &lt;/b&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href=&quot;&lt;%= Url.Action(&quot;GetCustomerInformationTab&quot;, &quot;Tab&quot;) %&gt;&quot; class=&quot;a&quot;&gt;&lt;b&gt;
              &lt;div id=&quot;customer-information&quot; class=&quot;menu&quot;&gt;
              &lt;/div&gt;
          &lt;/b&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href=&quot;&lt;%= Url.Action(&quot;GetRatesAndChargesTab&quot;, &quot;Tab&quot;) %&gt;&quot; class=&quot;a&quot;&gt;&lt;b&gt;
              &lt;div id=&quot;rates-and-charges&quot; class=&quot;menu&quot;&gt;
              &lt;/div&gt;
          &lt;/b&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href=&quot;&lt;%= Url.Action(&quot;GetPaymentsAndVouchersTab&quot;, &quot;Tab&quot;) %&gt;&quot; class=&quot;a&quot;&gt;&lt;b&gt;
              &lt;div id=&quot;payments-and-vouchers&quot; class=&quot;menu&quot;&gt;
              &lt;/div&gt;
          &lt;/b&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href=&quot;&lt;%= Url.Action(&quot;GetDeliveryAndCollectionTab&quot;, &quot;Tab&quot;) %&gt;&quot; class=&quot;a&quot;&gt;&lt;b&gt;
              &lt;div id=&quot;delivery-and-collection&quot; class=&quot;menu&quot;&gt;
              &lt;/div&gt;
          &lt;/b&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href=&quot;&lt;%= Url.Action(&quot;GetGeneralTab&quot;, &quot;Tab&quot;) %&gt;&quot; class=&quot;a&quot;&gt;&lt;b&gt;
              &lt;div id=&quot;general&quot; class=&quot;menu&quot;&gt;
              &lt;/div&gt;
          &lt;/b&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href=&quot;&lt;%= Url.Action(&quot;GetEquipmentAndOtherDriversTab&quot;, &quot;Tab&quot;) %&gt;&quot; class=&quot;a&quot;&gt;
              &lt;b&gt;
                  &lt;div id=&quot;equipment-and-other-drivers&quot; class=&quot;menu&quot;&gt;
                  &lt;/div&gt;
              &lt;/b&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href=&quot;&lt;%= Url.Action(&quot;GetCustomerPreferencesTab&quot;, &quot;Tab&quot;) %&gt;&quot; class=&quot;a&quot;&gt;&lt;b&gt;
              &lt;div id=&quot;customer-preferences&quot; class=&quot;menu&quot;&gt;
              &lt;/div&gt;
          &lt;/b&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href=&quot;&lt;%= Url.Action(&quot;GetCustomerStatisticsTab&quot;, &quot;Tab&quot;) %&gt;&quot; class=&quot;a&quot;&gt;&lt;b&gt;
              &lt;div id=&quot;customer-statistics&quot; class=&quot;menu&quot;&gt;
              &lt;/div&gt;
          &lt;/b&gt;&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
  </code></pre>
  <p>Any help is appreciated.</p>
  <p>Thanks.</p>