Tutorial: Queries

Click the buttons below to see which nodes are selected by the corresponding queries.

These lists are rendered from the following markup:

<ul id="list">
	<li class="odd">
		<div class="bold">
			<a class="odd">Odd</a>
		</div>
	</li>
	<li class="even">
		<div class="italic">
			<a class="even">Even</a>
		</div>
	</li>
	<li class="odd">
		<a class="odd">Odd</a>
	</li>
	<li class="even">
		<div class="bold">
			<a class="even">Even</a>
		</div>
	</li>
	<li class="odd">
		<div class="italic">
			<a class="odd">Odd</a>
		</div>
	</li>
	<li class="even">
		<a class="even">Even</a>
	</li>
</ul>

<ul id="list2">
	<li class="odd">Odd</li>
</ul>