lovi,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<style type="text/css">
.passive { display: none; }
.active { display: block; }
</style>
<meta charset="utf-8">
<script>
window.onload = function() {
var select = document.getElementById('select'),
curr = null;
select.onchange = function() {
var name = this.value,
target = document.getElementById(name + '-i');
if (curr) curr.className = 'passive';
if (target) target.className = 'active';
curr = target;
};
}
</script>
</head>
<body>
<select id="select">
<option>Number List</option>
<option value="first">number 1</option>
<option value="second">number 2</option>
<option value="third">number 3</option>
</select>
<div>
<div class="passive" id="first-i">number 1 content</div>
<div class="passive" id="second-i">number 2 content</div>
<div class="passive" id="third-i">number 3 content</div>
</div>
</body>
</html>