[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 568
  • Last Modified:

jQuery remove class from 2nd column of table

I'm trying to remove a class from the 2nd column only of each row in a tbody (without success).

I've tried:

$('#tsTable tbody tr td').next().removeClass('rmb');
which removes it from all columns (not what I want)

and also:

$('#tsTable tbody tr td:eq(1)').removeClass('rmb');
and:

$('#tsTable tbody tr > td:eq(1)').removeClass('rmb');
both of which seem to do nothing.

Any help would be appreciated.
0
ShanghaiD
Asked:
ShanghaiD
  • 2
  • 2
1 Solution
 
kswathiCommented:
can you give some dummy class to the second td and remove the class with that class. or give some id & remove with that id. Is the table generated dynamically? can you give the table structure?
0
 
ShanghaiDAuthor Commented:
The table columns are generated after a getJSON call, as follows:

$.getJSON(.......}, function(json) {
 var strHTML=''; // set empty string
 var sum = []; // initialise totals variables
 $.each([1,2,3,4,5,6,7], function(n,v){
  sum[v] = 0;//set sums as zero
 });
 $.each(json.DATA, function(i,col) {
  $.each([1,2,3,4,5,6,7], function(n,v){
   sum[v] += parseFloat(col[v]);//update sums
  });
 strHTML += '<tr">'; //open new row
 strHTML += '<td abbr="' + col[0] + '">' + col[0] + '</td>'; //add debtor column
 $.each([1,2,3,4,5,6,8], function(n,v){
  strHTML += '<td class="rmb" abbr="' + col[v] + '">' + addCommasOrBlank(parseFloat(col[v]).toFixed()) + '</td>'; //add numerical columns
 });
 strHTML += '</tr>'; //close row
});
$('#tsTable tbody').append(strHTML);//append table tbody rows

Open in new window


I will use your suggestion of inserting a dummy class to locate the column if there is no "better" solution (and award you points for the answer) -- but I was really trying to find out if their was a direct way of accessing only column 2 in each row.
I have successfully used last-child in
$('#tsTable tbody tr td:last-child').addClass('daysold');

Open in new window

and I was hoping there was a way of similarly accessing (only) column 2 (or 3 or whatever) -- not just first-child or last-child.  The documentation seemed to indicate that this was possible using :eq(1) syntax, but I have not been successful with that.
0
 
kswathiCommented:
Actually you approach is right but you must check actually how the html is rendering. As per your code [$('#tsTable tbody tr td:eq(1)').removeClass('rmb');]
 the table   "tsTable" has "tbody" and then "tr" ,then "td" as you are appending the code to the table check if it is correctly appending  while rendering.

Hope it helps.
0
 
ShanghaiDAuthor Commented:
Thanks! I am giving you the points because you have lead me to the solution I was seeking.  Your code removes the class only from the second column of the first row of the tbody.  I want to remove it from every second column of every row of the tbody.  Your suggestion has lead me to that solution, which is to use :nth-child() instead of :eq():

$('#tsTable tbody tr td:nth-child(2)').removeClass('rmb');

works perfectly!
0

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now