title: Get hidden fields from currently clicked td and first td of the current row
body: <p><em>Consider a scenario</em></p>
  <p>I have one table and having 8 columns, Each columns have some number of hidden fields - let's say 5 hidden fields.</p>
  <p>What I'm trying to achieve is to get all the hidden fields' value when I click on particular cell and I also want hidden values from the first td of the currently clicked row from [cell]</p>
  <h1>Things achieved</h1>
  <p>I'm able to get the hidden field values of the currently clicked row cell's first child like following</p>
  <pre><code>element.closest(&quot;tr&quot;).find(&quot;td:first&quot;).find(&quot;input:hidden&quot;)
  </code></pre>
  <p>This will reult 3 as the first cell will always have 3 inputs.</p>
  <h1>Where I am stuck:</h1>
  <p>I'm getting the first cell's hidden inputs value but not able to get hidden inputs value of  currently clicked cell.</p>
  <p><strong>Here is the sample HTML</strong></p>
  <pre><code>&lt;table&gt;
     &lt;tr&gt;
        &lt;td style=&quot;width: 50px;&quot;&gt;4th Class( A ) 
           &lt;input id=&quot;SectionID&quot; name=&quot;SectionID&quot; type=&quot;hidden&quot; value=&quot;7&quot;&gt;
           &lt;input id=&quot;SectionDetailID&quot; name=&quot;SectionDetailID&quot; type=&quot;hidden&quot; value=&quot;1&quot;&gt;
           &lt;input id=&quot;SectionName&quot; name=&quot;SectionName&quot; type=&quot;hidden&quot; value=&quot;4th Class( A ) &quot;&gt;
        &lt;/td&gt;
        &lt;td class=&quot;cells&quot; onclick=&quot;fetchData(this);&quot;&gt;
           &lt;div&gt;
              &lt;div class=&quot;dataRow&quot;&gt;
                 &lt;div class=&quot;cellLabel&quot;&gt;Name:&lt;/div&gt;
                 &lt;div class=&quot;cellValue&quot;&gt;P D S&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;dataRow&quot;&gt;
                 &lt;div class=&quot;cellLabel&quot;&gt;Sub:&lt;/div&gt;
                 &lt;div class=&quot;cellValue&quot;&gt;Hindi&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;dataRow&quot;&gt;
                 &lt;div class=&quot;cellLabel&quot;&gt;Period:&lt;/div&gt;
                 &lt;div class=&quot;cellValue&quot;&gt;Period 2&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;dataRow&quot;&gt;
                 &lt;div class=&quot;cellLabel&quot;&gt;From:&lt;/div&gt;
                 &lt;div class=&quot;cellValue&quot;&gt;11:00&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;dataRow&quot;&gt;
                 &lt;div class=&quot;cellLabel&quot;&gt;To:&lt;/div&gt;
                 &lt;div class=&quot;cellValue&quot;&gt;12:00&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;dataRow&quot;&gt;
                 &lt;div class=&quot;cellLabel&quot;&gt;Year:&lt;/div&gt;
                 &lt;div class=&quot;cellValue&quot;&gt;2014&lt;/div&gt;
              &lt;/div&gt;
           &lt;/div&gt;
           &lt;input id=&quot;TimeTableDtlID&quot; name=&quot;TimeTableDtlID&quot; type=&quot;hidden&quot; value=&quot;1&quot;&gt;
           &lt;input id=&quot;TimeTableHdrID&quot; name=&quot;TimeTableHdrID&quot; type=&quot;hidden&quot; value=&quot;7&quot;&gt;
           &lt;input id=&quot;PeriodID&quot; name=&quot;PeriodID&quot; type=&quot;hidden&quot; value=&quot;38&quot;&gt;
           &lt;input id=&quot;PeriodName&quot; name=&quot;PeriodName&quot; type=&quot;hidden&quot; value=&quot;Period 2&quot;&gt;
           &lt;input id=&quot;PeriodFromTime&quot; name=&quot;PeriodFromTime&quot; type=&quot;hidden&quot; value=&quot;11:00&quot;&gt;
           &lt;input id=&quot;PeriodToTime&quot; name=&quot;PeriodToTime&quot; type=&quot;hidden&quot; value=&quot;12:00&quot;&gt;
           &lt;input id=&quot;TTYear&quot; name=&quot;TTYear&quot; type=&quot;hidden&quot; value=&quot;2014&quot;&gt;
           &lt;input id=&quot;SubjectName&quot; name=&quot;SubjectName&quot; type=&quot;hidden&quot; value=&quot;Hindi&quot;&gt;
        &lt;/td&gt;
        &lt;td class=&quot;cells&quot; onclick=&quot;fetchData(this);&quot;&gt;
           &lt;div&gt;
              &lt;div class=&quot;dataRow&quot;&gt;
                 &lt;div class=&quot;cellLabel&quot;&gt;Name:&lt;/div&gt;
                 &lt;div class=&quot;cellValue&quot;&gt;J P Pl&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;dataRow&quot;&gt;
                 &lt;div class=&quot;cellLabel&quot;&gt;Sub:&lt;/div&gt;
                 &lt;div class=&quot;cellValue&quot;&gt;English&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;dataRow&quot;&gt;
                 &lt;div class=&quot;cellLabel&quot;&gt;Period:&lt;/div&gt;
                 &lt;div class=&quot;cellValue&quot;&gt;Period 2&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;dataRow&quot;&gt;
                 &lt;div class=&quot;cellLabel&quot;&gt;From:&lt;/div&gt;
                 &lt;div class=&quot;cellValue&quot;&gt;11:00&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;dataRow&quot;&gt;
                 &lt;div class=&quot;cellLabel&quot;&gt;To:&lt;/div&gt;
                 &lt;div class=&quot;cellValue&quot;&gt;12:00&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;dataRow&quot;&gt;
                 &lt;div class=&quot;cellLabel&quot;&gt;Year:&lt;/div&gt;
                 &lt;div class=&quot;cellValue&quot;&gt;2014&lt;/div&gt;
              &lt;/div&gt;
           &lt;/div&gt;
           &lt;input id=&quot;TimeTableDtlID&quot; name=&quot;TimeTableDtlID&quot; type=&quot;hidden&quot; value=&quot;3&quot;&gt;
           &lt;input id=&quot;TimeTableHdrID&quot; name=&quot;TimeTableHdrID&quot; type=&quot;hidden&quot; value=&quot;7&quot;&gt;
           &lt;input id=&quot;PeriodID&quot; name=&quot;PeriodID&quot; type=&quot;hidden&quot; value=&quot;38&quot;&gt;
           &lt;input id=&quot;PeriodName&quot; name=&quot;PeriodName&quot; type=&quot;hidden&quot; value=&quot;Period 2&quot;&gt;
           &lt;input id=&quot;PeriodFromTime&quot; name=&quot;PeriodFromTime&quot; type=&quot;hidden&quot; value=&quot;11:00&quot;&gt;
           &lt;input id=&quot;PeriodToTime&quot; name=&quot;PeriodToTime&quot; type=&quot;hidden&quot; value=&quot;12:00&quot;&gt;
           &lt;input id=&quot;TTYear&quot; name=&quot;TTYear&quot; type=&quot;hidden&quot; value=&quot;2014&quot;&gt;
           &lt;input id=&quot;SubjectName&quot; name=&quot;SubjectName&quot; type=&quot;hidden&quot; value=&quot;English&quot;&gt;
        &lt;/td&gt;
     &lt;/tr&gt;
     &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  <p><strong>jQuery</strong></p>
  <pre><code>function fetchData(element) {
     var $element = $(element);
     var objHidden = [];
     console.log($element.closest(&quot;tr&quot;).find('td:first').andSelf().find(&quot;input:hidden&quot;).length); // Returns 19 Where it must be 11
     $element.closest(&quot;tr&quot;).find('td:first').andSelf().find(&quot;input:hidden&quot;).each(function (i, elem) {
        objHidden[elem.getAttribute(&quot;name&quot;)] = elem.value;
     });
     console.log(objHidden); // Getting same values always
  }
  </code></pre>
  <p><a href="http://jsfiddle.net/x3HN3/2/" rel="nofollow noreferrer"><h2>Fiddle DEMO</h2></a></p>
  <p><strong>EDIT</strong></p>
  <p><em>It's Simple scenario when I click on cell means <code>TD</code> except the first one, I want hidden values from the currently clicked cells and also hidden values from the first <code>TD</code> in current row which is not clicked.</em></p>
  <p><strong>How to get hidden fields of currently clicked cell and hidden fields of the closest row's first td?</strong></p>
  <p>Any kind of help is greatly appreciated.</p>