Hello,

Well, this must be very simple to do for most of you, but I have no idea how to accomplish this.

I have a set of tabs and on top of the tabs is a set of checkboxes ; each checkbox 'corresponds' to a tab.

What I need is to be able to activate/deactivate each checkbox and have its corresponding tab (and the tab's content) hide/display.

Here's my HTML:

<div class="show-results-from">
  <ul>
    <li>See results from:</li>
    <li>
      <label>
        <input type="checkbox" name="a" id="a">
        Products &amp; Services <span>(16)</span></label>
    </li>
    <li>
      <label>
        <input type="checkbox" name="b" id="b">
        Publications <span>(9)</span></label>
    </li>
    <li>
      <label>
        <input type="checkbox" name="c" id="c">
        Other <span>(150)</span></label>
    </li>
  </ul>
</div>
<ul class="tabs">
  <li><span rel="tabs1" class="defaulttab">Products &amp; Services</span></li>
  <li><span rel="tabs2">Publications</span></li>
  <li><span rel="tabs3">Other</span></li>
</ul>
<div class="tab-content" id="tabs1">content</div>
<div class="tab-content" id="tabs2">content</div>
<div class="tab-content" id="tabs3">content</div>

Any help with this is greatly appreciated.