19

I have a number of tables, which have nested tables. I using jQuery to hide some of the table cells as a number are empty or the contents irrelevant.

I use jQuery to hide all TD's and then jQuery to show them, for instance, if they contain a <P>.

Unfortunately some of the TD's don't contain anything but still need to be shown. The class the TD's are given is dynamic so I wont be able to code for them all (Sensibly) however they do all end 'Node'

I was wondering if its possible to do something like...

$(function() {
   $('TR .*Node').css('display','inline');
});
BoltClock
  • 700,868
  • 160
  • 1,392
  • 1,356
CLiown
  • 13,665
  • 48
  • 124
  • 205
  • 1
    A bit unreleated, but what exactly does the `$(function() {...});` bit mean? What's the difference between that and just writing the contents? Is it to do with scope? – Eric Sep 02 '09 at 16:04
  • So a shorthand for `$(document).ready()`, or `$(window).load()`? – Eric Sep 02 '09 at 16:10
  • Which one? `$(document).ready()`, or `$(window).load()`? – Eric Sep 03 '09 at 08:36

3 Answers3

38

This will select any tds with Node somewhere in their class name.

$('td[class*=Node]').css('display','inline');

This will select any tds with Node at the end of their class name.

$('td[class$=Node]').css('display','inline');

Bear in mind that .show() does roughly the same thing as .css('display','inline');

Eric
  • 95,302
  • 53
  • 242
  • 374
  • 1
    Just a note: I've had some trouble with the $= version in Firefox recently. If you have the same problem considering designing your classes a little differently. Remember, you aren't limited to one class per element. – krdluzni Sep 02 '09 at 16:15
  • 2
    Which reminds me, `'td[class$=Node]'` will *not* match ``, as the class text does not end in `node` – Eric Sep 02 '09 at 16:20
3

The [attribute$="value"] selector will let you match attributes that end with a particular value. Note that using show() instead of changing the CSS directly will retain the display characteristics of the element you are revealing. If you really want to force them to display inline, you can revert it back to the css method with display: inline

 $('td[class$="Node"]').show();
tvanfosson
  • 524,688
  • 99
  • 697
  • 795
2
$(function() {
     $('td[class*=Node]').css('display','inline');
});
kaiz.net
  • 1,984
  • 3
  • 23
  • 31