title: Jquery tools (accordion / tabs) + LiveQuery
body: <p>I am using jquery tools + livequery. I have a horizontal accordion with 4 elements. On initial page load they are created by a PHP-script, so the accordion works great - first tab opens, and everything slides properly. (just like in this example: <a href="http://flowplayer.org/tools/demos/tabs/accordion-horizontal.html" rel="nofollow">http://flowplayer.org/tools/demos/tabs/accordion-horizontal.html</a>)</p>
  
  <p>I have a timer event that reloads the accordion elements via JSON. As soon as that happens - tabs aren't activated. I've been trying to attach a livequery event once the accordion is reloaded, but I can't figure it out.</p>
  
  <p>Structure is like this:</p>
  
  <pre><code>&lt;div id="accordion"&gt;
  &lt;div class="accordion_element&gt;[tab content]&lt;/div&gt;
  &lt;div class="accordion_element&gt;[tab content]&lt;/div&gt;
  &lt;div class="accordion_element&gt;[tab content]&lt;/div&gt;
  &lt;div class="accordion_element&gt;[tab content]&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I activate the accordion by:</p>
  
  <pre><code>$("#accordion").tabs("#accordion .div_body", {
      tabs: '.img_bgr', 
      effect: 'horizontal'
  });
  </code></pre>
  
  <p>And it works like a charm - first tab is expanded, other tabs are clickable and expand when clicked. Then every minute I trigger:</p>
  
  <pre><code>$.getJSON("accordion.php", function(json){
      $.each(json, function(key, val) {
      //-------parse json here and append each accordion_item (I empty the accordion prior)
      $('#accordion').append(accordion_item);
      });
  });
  </code></pre>
  
  <p>So at this point i have a beautiful accordion, but it is not activated - it's just tabs.</p>
  
  <p>How do i attach a livequery event to the following so that it effects all future updates to #accordion? </p>
  
  <pre><code>$("#accordion").tabs("#accordion .div_body", {
      tabs: '.img_bgr', 
      effect: 'horizontal'
  });
  </code></pre>
  
  <hr>
  
  <p>essentially i need to be able to assign .live (or livequery) to .tabs  which will control all clicks etc.</p>
  
  <p>on this page -  <a href="http://flowplayer.org/tools/demos/tabs/accordion-horizontal.html" rel="nofollow">http://flowplayer.org/tools/demos/tabs/accordion-horizontal.html</a><br>
  imagine the 3 images + exposed text gets reloaded with json and .tabs has no further effect.</p>
  
  <p>like this (which doesnt work of course)</p>
  
  <pre><code>$("#accordion").live( '.tabs', function(){
  "#accordion .div_body", {
  tabs: '.img_bgr', 
  effect: 'horizontal'
  };
  </code></pre>