title: jQuery hide table row
body: <p>I have the following jQuery script which hides/expands row in table:</p>
  
  <p>it was inspired by this example:</p>
  
  <p><a href="http://www.jankoatwarpspeed.com/examples/expandable-rows/" rel="nofollow">http://www.jankoatwarpspeed.com/examples/expandable-rows/</a></p>
  
  <pre><code>&lt;script type="text/javascript"&gt;  
  
  $(document).ready(function(){
      $("#orders tr:odd").addClass("odd");
      $("#orders tr:not(.odd)").hide();
      $("#orders tr:first-child").show();
  
      $("#orders tr.odd").click(function(){
          $(this).next("tr").toggle();
          $(this).find(".toggler").toggleClass("on");
          $(this).find(".toggler").text("hide");
  
      });
  });
  
  &lt;/script&gt;        
  </code></pre>
  
  <p>My HTML is the following:</p>
  
  <pre><code>&lt;table class="blueWrapperTbl" id="orders"&gt;
    &lt;tbody&gt;
      &lt;tr&gt;
        &lt;td&gt;  &lt;h:outputText value="#{order.orderId}" /&gt; &lt;/td&gt;
        &lt;td&gt;  &lt;h:outputText value="#{order.orderId}" /&gt; &lt;/td&gt;
        &lt;td&gt;  &lt;h:outputText value="#{order.orderId}" /&gt; &lt;/td&gt;
        &lt;td&gt;  &lt;h:outputText value="#{order.orderId}" /&gt; &lt;/td&gt;
        &lt;td&gt;&lt;a href="#" class="ubber"&gt;&lt;b&gt;Change Order&lt;/b&gt;&lt;/a&gt;&lt;/td&gt;
        &lt;td&gt;&lt;a href="#" class="toggler"&gt;Show&lt;/a&gt;&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
      ...
      &lt;/tr&gt; 
  &lt;/table&gt;
  </code></pre>
  
  <p>The relevant CSS parts is the following:</p>
  
  <pre><code>.blueWrapperTbl .toggler { background:url(../images/plus.gif) right center no-repeat; padding-right:20px; display:inline-block; text:'fff'}
  .blueWrapperTbl .toggler.on { background:url(../images/minus.gif) right center no-repeat; }
  </code></pre>
  
  <p>I need to do the following:</p>
  
  <ol>
  <li>When my row is expended I would like to change 'toggler' text from 'Show' to 'hide'.</li>
  <li>When my row is hidden I dont need to show 'Change order' URL. It must be hidden.</li>
  </ol>
  
  <p>Please help me. </p>