title: Using jQuery UI Tabs. How would I make one of the tabs link to a URL rather than load a tab panel?
body: <p>I am using jQuery UI tabs to create a vertical tab section of a page, and want the last vertical tab to link out to a URL rather than load a tab panel. </p>
  
  <p>Any suggestions for the best way to do this? I can stick another element besides an LI into the list, but would rather have the last li just behave differently.</p>
  
  <p>Thanks for any help. </p>
  
  <p>Here's my javascript:</p>
  
  <pre><code>  // vtabs
    $("#aboutprod-tabs").tabs(
      { fx: [{opacity:'toggle', duration:'normal'},
      {opacity:'toggle', duration:'fast'}] })
      .addClass('ui-tabs-vertical'); 
  </code></pre>
  
  <p>And HTML </p>
  
  <pre><code>&lt;div id="aboutprod-tabs"&gt;
    &lt;ul&gt;
      &lt;li&gt;&lt;a href="#tabs-1"&gt;First&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#tabs-2"&gt;Second&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#tabs-3"&gt;3rd&lt;/a&gt;&lt;/li&gt;
      &lt;li class="last"&gt;&lt;a href="/products"&gt;Learn more...&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
    &lt;div id="tabs-1"&gt;
      Tab panel 1
    &lt;/div&gt;
    &lt;div id="tabs-2"&gt;
      Tab panel 2  
    &lt;/div&gt;
    &lt;div id="tabs-3"&gt;
      Tab panel 3
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>