Javascript or jQuery passing ID values to show or hide a selected Div
<p>I have a table which is outlined below, this is generated from an old XML file using XLST, to style the page, these files "CANT" be modified by myself, but all have a general template base to them... and all use the goTab() function to show or hide a specific div</p>

<pre><code>&lt;table cellspacing="0" cellpadding="0"&gt;
&lt;tr&gt;
&lt;td class="tab_active" id="tab_1" onclick="goTab(1)"&gt;Key Messages&lt;/td&gt;
&lt;td class="tab" id="tab_2" onclick="goTab(2)"&gt;Links&lt;/td&gt;
&lt;td class="tab" id="tab_3" onclick="goTab(3)"&gt;Red Flags&lt;/td&gt;
&lt;td class="tab" id="tab_4" onclick="goTab(4)"&gt;Referral Pathway&lt;/td&gt;
&lt;td class="tab" id="tab_5" onclick="goTab(5)"&gt;Clinical Data&lt;/td&gt;
&lt;td class="tab" id="tab_6" onclick="goTab(6)"&gt;Past Medical / Family History&lt;/td&gt;
&lt;td class="tab" id="tab_7" onclick="goTab(7)"&gt;Medication&lt;/td&gt;
&lt;td class="tab" id="tab_8" onclick="goTab(8)"&gt;Risks/Alerts&lt;/td&gt;
&lt;td class="tab" id="tab_9" onclick="goTab(9)"&gt;Demographics&lt;/td&gt;
&lt;td class="tab" id="tab_10" onclick="goTab(10)"&gt;Referral&lt;/td&gt;
&lt;td class="tab" id="tab_11" onclick="goTab(11)"&gt;Transport&lt;/td&gt;
&lt;/tr&gt;
&lt;/table&gt;
</code></pre>

<p>If a tab has been clicked it will show/hide a specific div ie: "divTabControl_1"
is shown if tab_1 is clicked, all the rest (could be a different number of tabs &amp; divs on each file)</p>

<p>the divs are coded as </p>

<pre><code>&lt;div class="categoryContent" id="divTabControl_1" style="visibility:visible;"&gt;
content here
&lt;/div&gt;
</code></pre>

<p>I'm trying to loop through each to find which 'tab_'+tabID has been clicked and then using that I need to show or hide the div contents based on each..</p>

<p>again I have to say i cant edit the files.. Prefer to do this in a jQuery function, but just not got the understanding of jQuery yet to do this..</p>

<p>Any help would be great..</p>

<p>Thanks</p>
