HTML　表示したモーションのつぎにフィードアウトのようなモーションの付け方

htmlのjavascriptで（例：Hello Worldを)一度表示した後にHelloだけフィードアウトなモーションをつけたいのですが、どうすればなりますか。
一応表示まではできました。

lang
1<html>
2<head>
3	 <meta charset="UTF-8">
4	<title>TextEffect Sample</title>
5	<link href='http://fonts.googleapis.com/css?family=Ropa+Sans' rel='stylesheet' type='text/css'>
6	<style>
7		#container {
8			width: 960px;
9			height: 340px;
10			padding-top: 200px;
11			background: url(imgs/bg.jpg);
12			font-family: 'Ropa Sans', cursive;
13		}
14
15		#myText {
16			position: relative;
17			text-align: center;
18			font-size: 48px;
19			display: none; /* エフェクト適用前に一瞬見えるのを防ぐため */
20		}
21
22		#myText span {
23			display: inline-block;
24			min-width: 10px;
25			opacity: 0;
26			-webkit-transform: scale(10);
27			transform: scale(10);
28		}
29
30		#myText span.motion {
31			opacity: 1;
32			-webkit-transform: scale(1);
33			-webkit-transition: all 0.5s;
34			transform: scale(1);
35			transition: all 0.5s;
36		}
37
38	</style>
39	<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
40	<script>
41		$(window).bind("load", function () {
42			// テキストを取得
43			var text = $("#myText").text();
44			$("#myText")
45					.empty() // 一旦、空にする
46					.show(); // 表示する
47			var arr = text.split(""); // 一文字ずつ、配列に格納
48			var elements = [];
49			var elements2 = [];
50
51			// 一文字ずつ、spanタグで包む
52			for (var i = 0; i < arr.length; i++) {
53				elements[i] = $("<span>" + arr[i] + "</span>");
54				$("#myText").append(elements[i]); // 元の場所に挿入
55			}
56
57			// エフェクトの適用
58			for (var i = 0; i < elements.length; i++) {
59				elements[i]
60						.delay(40 * i)
61						.queue(function () {
62							$(this).addClass("motion");
63						});
64		}
65		});
66	</script>
67</head>
68<body>
69	<CENTER>
70	<div id="container">
71    <p id="myText">Hello World</p>
72</div>
73    </CENTER>
74</body>
75</html>
76
77コード