How to add a class to each TD in a TR when the TR gets selected
<p>I am using HTML, PHP and JS to create a report website. I've got several table that I'm showing. In each table there are multiple rows <code>tr</code> with many columns <code>td</code>. I have it setup so that when I click on one of the <code>tr</code> it gets the class of <code>selected</code>. I also have it setup so that the <code>td</code> that is clicked in gets the class of <code>selectedtd</code>. What I want is to have all the <code>td</code> in the <code>tr</code> that gets selected to have the class <code>selectedtd</code> and then to have that class removed when the <code>tr</code> is unselected. Here's what I've got so far:</p>

<p>This script updates the <code>tr</code> to either have the class or remove it when anywhere in the <code>tr</code> is clicked.</p>

<pre><code>&lt;script type='text/javascript'&gt;//&lt;![CDATA[
    $("#UpdateTable tr").click(function ()
    {
        $(this).toggleClass('selected').siblings().removeClass('selected');
    });
    //]]&gt;
&lt;/script&gt;
</code></pre>

<p>This script adds or removes the class <code>selectedtd</code> to an individual <code>td</code> when it is clicked.</p>

<pre><code>&lt;script type='text/javascript'&gt;//&lt;![CDATA[
    $("#UpdateTable td").click(function ()
    {
        $(this).closest('table').find('td').not(this).removeClass('selectedtd');
        $(this).toggleClass('selectedtd')
    });
    //]]&gt;
&lt;/script&gt;
</code></pre>

<p>I can't figure out how to get these to update all the <code>td</code> in the selected <code>tr</code> to have the class <code>selectedtd</code>.</p>