Call click function only for TH with class <p>I have table</p> <pre><code>&lt;table id="dataTable"&gt; &lt;thead&gt; &lt;tr&gt; &lt;th&gt;TH 1&lt;/th&gt; &lt;th&gt;TH 2&lt;/th&gt; &lt;th class="sortable"&gt;TH 3&lt;/th&gt; &lt;th&gt;TH 4&lt;/th&gt; &lt;th&gt;TH 5&lt;/th&gt; &lt;th class="sortable"&gt;TH 6&lt;/th&gt; &lt;th&gt;TH 7&lt;/th&gt; &lt;th&gt;TH 8&lt;/th&gt; &lt;/tr&gt; &lt;/thead&gt; &lt;tbody&gt; &lt;tr&gt; &lt;td&gt;Data 1&lt;/td&gt; &lt;td&gt;Data 2&lt;/td&gt; &lt;td&gt;Data 3&lt;/td&gt; &lt;td&gt;Data 4&lt;/td&gt; &lt;td&gt;Data 5&lt;/td&gt; &lt;td&gt;Data 6&lt;/td&gt; &lt;td&gt;Data 7&lt;/td&gt; &lt;td&gt;Data 8&lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; </code></pre> <p>I need solution for add class into TD only under TH with class "sortable" but only If I click only to TH with class sortable.</p> <p>Now I use Jquery code </p> <pre><code>$("#dataTable th").click(function () { if ($("th").hasClass("sortable") { // has specialclass var colIndex = $(this).parent().children().index($(this)); $('tr').find('td.td-sorting').removeClass('td-sorting'); $('tr').find('td:eq(' + colIndex + ')').addClass('td-sorting'); } }); </code></pre> <p>This part of code works fine:</p> <pre><code>var colIndex = $(this).parent().children().index($(this)); $('tr').find('td.td-sorting').removeClass('td-sorting'); $('tr').find('td:eq(' + colIndex + ')').addClass('td-sorting'); } </code></pre> <p>But not works call function only for TH with class "sortable"</p>