title: How to hide a HTML row by index?
body: <p>I'm attempting to hide certain rows of my HTML table based on their index but I get the error:</p>
  
  <blockquote>
    <p>TypeError: $rows[0].hide is not a function</p>
  </blockquote>
  
  <p>What am I doing wrong?</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;tbody id="searchable"&gt;
          &lt;c:forEach var="lot" items="${pageResult.entries}" varStatus="status"&gt;
              &lt;tr title="&lt;c:out value='${lot.description}'/&gt;"&gt;
              &lt;td&gt;&lt;c:out value='${lot.nom}'/&gt;&lt;/td&gt;
              &lt;td&gt;&lt;fmt:formatNumber value="${lot.id}" pattern="0000"/&gt;&lt;/td&gt;
              &lt;td&gt;&lt;c:out value='${lot.priorite}'/&gt;&lt;/td&gt;
              &lt;td&gt;
                  &lt;form:form class="actionForm" action="detail" method="POST"&gt;
                      &lt;input type="hidden" name="lotId" value="&lt;c:out value='${lot.nom}'/&gt;"/&gt;
                      &lt;input type="submit" class="action editer" value="Editer"/&gt;
                  &lt;/form:form&gt;
                  &lt;form:form class="actionForm" action="supprimer" method="POST" onsubmit="return confirm('Confirmer la suppression?')"&gt;
                      &lt;input type="hidden" name="lotId" value="&lt;c:out value='${lot.nom}'/&gt;"/&gt;
                      &lt;input type="submit" class="action supprimer" value="Supprimer"/&gt;
                  &lt;/form:form&gt;
              &lt;/td&gt;&lt;/tr&gt;
          &lt;/c:forEach&gt;
  &lt;/tbody&gt;
  </code></pre>
  
  <p>Javascript:</p>
  
  <pre><code>var $rows = $('#searchable tr');
  $(document).ready(function(){
      $rows[0].hide();
  });
  </code></pre>