jquery - Hide all next tr td until next tr th -


It should be simple, but this jQuery function is taking an element more, even I think Hide jQuery

What I would like to do, that happens when someone clicks on tr th , next to tr td next tr Th .

How can I make this code work? 

  & lt ;! DOCTYPE html & gt; & Lt; Html & gt; & Lt; Top & gt; & Lt; Script src = "http://code.jquery.com/jquery-latest.js" & gt; & Lt; / Script & gt; & Lt; Style & gt; Th (background: #dad; fonts thickness: bold; font-size: 16px; width: 50%;} Td {background: red; fonts thickness: bold; font-size: 16px; width: 50%;} & Lt; / style & gt; & lt; / head> gt; body & gt; & lt; table id = "example" & gt; & lt; tr & gt; & lt; th & gt; & lt Click the button & gt; Show it 3 & lt; / button & gt; & lt; / th & gt; & lt; / tr & gt; & lt; tr & gt; & lt; td & gt; Test 1 & lt; ; / Td> & lt; / tr & gt; & lt; tr & gt; & lt; td> Test 2 & lt; / td & gt; & lt; / tr & gt; & lt; tr & Gt; & lt; th & gt; & lt; button & gt; show it 2 & lt; / button & gt;  ; & Lt; td & gt; Test 3 & Lt; / td> & lt; / TR & gt; & lt; tr & gt; & lt; td> Test 4 & lt; / td & gt; & lt; / tr & gt; & lt ; / Table & gt; & lt; script & gt; $ ('# example tr th') click (function () {// warning ($ (this) .Parent (.) Html ()) $ (this) .Parent (). NextUntil ('tr th') Toggle ();})   & Lt; / Html & gt;    
 
 
 You can add a class to  tr  elements < Code> th  element is:  
  & lt; Table id = "example" & gt; & Lt; TR & gt; & Lt; Th class = 'toggle' & gt; & Lt; Button & gt; Show it 3 & lt; / Button & gt; & Lt; / Th & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; Td> Test 1 & lt; / Td> & Lt; / TR & gt; & Lt; TR & gt; & Lt; Td> Test 2 & lt; / Td> & Lt; / TR & gt; & Lt; Tr class = 'toggle' & gt; & Lt; Th & gt; & Lt; Button & gt; Show it 2 & lt; / Button & gt; & Lt; / Th & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; Td> Test 3 & lt; / Td> & Lt; / TR & gt; & Lt; TR & gt; & Lt; Td> Test 4 & lt; / Td> & Lt; / TR & gt; & Lt; / Table & gt;   
  
  $ ('# example tr th'). Click (function () {$ (this) .Parent (). NextUntil ('toggle'). Toggle ();})   
   < / Html>

Comments

Post a Comment