1 <!DOCTYPE html PUBLIC
"-//W3C//DTD HTML 4.01//EN">
4 <title>Dynamic updating of :first-child and :last-child
</title>
5 <style type=
"text/css">
6 #two:first-child
{ background: red
; }
7 #three:last-child
{ background: lime
; }
9 <link rel=
"first" href=
"css3-modsel-1.html" title=
"Groups of selectors">
10 <link rel=
"prev" href=
"css3-modsel-d2.html" title=
"Dynamic handling of combinators">
11 <link rel=
"up" href=
"./index.html">
12 <link rel=
"top" href=
"../../index.html">
18 <script type=
"text/javascript">
22 el2
= document
.getElementById('two');
23 el3
= document
.getElementById('three');
24 el2
.parentNode
.insertBefore(el3
.nextSibling
, el2
);
31 <div><p id=
"two">This line should be unstyled. (
2)
</p><p id=
"three">This line should have a green background. (
3)
</p><p>This line should be unstyled. (
4 moving to
1)
</p></div>