jQuery - Selector: Styling Sub Level Item Step By Step Tutorial

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

jQuery - Selector: Styling Sub Level Item

Tag: jQuery, $(), factory, function, selectors, css, list item, style Category: JavaScript
post: 21 Mar 2008 read: 480

jQuery Selector Step By Step Tutorial - Part 3: In this post, we modify sub level item. For this job, choose a descendant of an element with an ID of favorite. Then, from that, choose that doesn't have a class of category.

Update song.js like this:


// JavaScript Document
$(document).ready(function(){
  $('#favorite > li').addClass('category');
  $('#favorite li:not(.category)').addClass('songs');
});

Next, add a class songs to css:


@charset "utf-8";
/* CSS Document */

.category{
  float:left;
  list-style:none;
  margin: 10px;
}
.songs{
 background-color:#FFFFCC;
}

You will get like this:

| Give Your Opinion | Recommend

Share and Bookmark to: These icons link to social bookmarking sites where readers can share and discover new web pages.

615

posting

Your Name *	:
Email *	:	(Will not be published)
Website/URL	:
Your Comment *	:

* Required

PHP Basic	PHP Classes	PHP Framework	PHP Application	PHP Security	PHP Editor
PHP Books	PHP Database	MySQL	Hosting	Apache	CSS
Motivation	Web Design	PHP API	JavaScript	Computer Tips

phpeveryday.com

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

jQuery - Selector: Styling Sub Level Item