phpeveryday.com

The best tutorial of php, php framework, php strategies, object oriented oriented,


jQuery - Selector: Styling Sibling

Tag: jQuery, $(), factory, function, selectors, custom selectors, table, style, row   Category: JavaScript
post: 21 Mar 2008 read: 501


jQuery Selector Step By Step Tutorial - Part 8: At previous post, we just modify style at special content. In this post, we will modify all <td> that sibling for that <td>.

Modify your js like this:


$(document).ready(function(){
  $('th').parent().addClass('table-header');
  $('tr:not([th]):odd').addClass('odd');	
  $('tr:not([th]):even').addClass('even');
  
  $('td:contains("Jude")').addClass('top40');
  $('td:contains("Jude")').siblings().addClass('top40');  
});

You will get like this:



Series this article:
jQuery - Selectors: Understanding The $() Factory Function
jQuery - Selector: Modifying Style at List Item Levels
jQuery - Selector: Styling Sub Level Item
jQuery - Selector: XPath Selectors
jQuery - Selector: Custom Selectors
jQuery - Selector: Choose a Style at Custom Selectors
jQuery - Selector: Modify Style for Table Header
jQuery - Selector: Styling Sibling
jQuery - Selector: Styling Next Cell

| Give Your Opinion | Recommend
Share and Bookmark to: These icons link to social bookmarking sites where readers can share and discover new web pages.
digg del.icio.us technorati Ma.gnolia BlinkList

Recommended articles by other readers:
Web Services: How PHP Kiss VB.NET? (Part 1)
Chart: How to Build Cool Animation Real Time Chart
Joomla: Fast Road to Understand Component Programming
Email: Send Attachement Mail
mod_rewrite - Part 1: create your "fantasy" URL

What do You Think?
Your Name *:
Email *:
(Will not be published)
Website/URL:
Your Comment *:
* Required


615
posting