title: jQuery addClass to parent and it's siblings
body: <p>I am trying to apply a class to an element's parent and it's siblings.  So far I have only been successful by applying two lines of jQuery which makes the end result apply in two stages looking pretty ugly.</p>
  
  <pre><code>&lt;style type="text/css"&gt;
  td.rostered {
      opacity: 0.3;
  }
  &lt;/style&gt;
  
  &lt;table&gt;
  &lt;tr class="flight_search"&gt;
      &lt;td class="" style="width: 6%; text-align: left"&gt;&lt;img id="525" class="roster" src="images/link_image.png" alt="Link Image"&gt;&lt;/td&gt;
      &lt;td class="" style="width: 7%"&gt;Option 1&lt;/td&gt;
      &lt;td class="" style="width: 24%"&gt;London -&lt;strong&gt;Paris&lt;/strong&gt;&lt;/td&gt;
      &lt;td class="" style="width: 25%"&gt;Dep: &lt;strong&gt;0355&lt;/strong&gt;  Arr: 0615 (02:20)&lt;/td&gt;
      &lt;td class="" style="width: 30%"&gt;Boeing 767&lt;/td&gt;
      &lt;td class="" style="width: 8%"&gt;&lt;a class="rego" href="#"&gt;ABCDE&lt;/a&gt;&lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>When the user clicks the image (with id="525") some ajax runs to assign that flight to the user's roster.  Then it returns with the id to run some jQuery to grey-out that row of the table, indicating that it is already rostered.</p>
  
  <pre><code>function set_rostered(id) {
  //This line adds the class 'rostered' the siblins of the &lt;td&gt;
  $("#" + id).parent().siblings().addClass('rostered');
  //This line removes the id so the flight cannot be rostered again and adds the class to the parent &lt;td&gt; itself.
  $("#" + id).attr('id', '').parent().addClass('rostered');
  } 
  </code></pre>
  
  <p>Is there a way I can combine these two lines of code to make the class apply to all elements (parent and it's siblings) at the same time?</p>