Show hide a div on change of select box using jQuery

<style>
	div {
		background-color: yellow;
		display: none;
		text-align: center;
		width: 200px;
		height: 200px;
		margin: 50px auto;
	}
	div.red {
		background-color: red;
		color: #fff;
	}
</style>

<script>
	$(document).ready(function () {
		$("select").change(function (){
			$("div").hide();
			if($(this).val() == 'yellow') {
				$("div.yellow").show();
			}
			else if($(this).val() == 'red') {
				$("div.red").show();
			}
		});
	});
</script>