title: After click on row, remove seletced class from another rows
body: <p>I have one small problem with my <strong>JQuery</strong> Code.</p>
  
  <p>I created simple table in HTML.</p>
  
  <pre><code>&lt;table class="table"&gt;
  &lt;tr&gt;
      &lt;th&gt;Name&lt;/th&gt;
      &lt;th&gt;Surname&lt;/th&gt;
      &lt;th&gt;&lt;/th&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
      &lt;td&gt;name 1&lt;/td&gt;
      &lt;td&gt;surname 1&lt;/td&gt;
      &lt;td&gt;actions&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
      &lt;td&gt;name 2&lt;/td&gt;
      &lt;td&gt;surname 3&lt;/td&gt;
      &lt;td&gt;actions&lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>Then I want to highlight the <code>row</code> in yellow, when I click on this <code>row</code>
  So when I am click on <code>row</code> add class "<code>selected</code>" but when I click on another <code>row</code> I have to remove "<code>selected</code>" class from previous row. So I tried create <strong>JQuery</strong> action</p>
  
  <pre><code>$('tr').not(':first').click(function () {
      var table = $(this).closest("table");
      var rows = table.children("tr");
      alert(rows.length);
      rows.each(function () {
          $(this).removeClass("selected");
      });
  
      $(this).addClass('selected');
  });
  </code></pre>
  
  <p>I tried find closest table from this clicked <code>row</code> and get all children <code>&lt;tr&gt;</code>,
  next in loop remove "<code>selected</code>" class and add to clicked <code>row</code> this class.</p>
  
  <p>But always <code>alert(rows.length)</code> return me 0 <code>row</code>s :&lt;</p>
  
  <p>Please help me.</p>
  
  <p>Thanks.</p>