jQuery getting value of select with mulitple values

I have been dipping into learning jQuery. Very powerful and useful. But as I am just learning it, I am taking a learning curve to figure it out. Today I came across the need to get the values of a select that had multiple values. I needed to take the name attribute from the option as it contained a filename that I was going to use to display the image. Further more I wanted to separate those images based on their dimensions.

After some thankless google searches, I came up with code that accomplishes this task easily.

jQuery(function(){
	$('#banners').change(function(){
		$('#images_preview_loader').empty();
		$('#images_preview_box').empty();
		$('#images_preview_tower').empty();

		$('#banners :selected').each(function(i, selected){
			id = $(selected).attr('value');
			filename = $(selected).attr('name');
			$('#images_preview_loader').append("");

			height = document.getElementById('bp_' + id).height;
			width = document.getElementById('bp_' + id).width;

			if (width < height)
			{
				$('#images_preview_tower').append("");
			}
			else
			{
				$('#images_preview_box').append("");
			}
		});
		$('#images_preview_loader').empty();
	});
});

As for the HTML, I have my select box with multiple=”multiple” in it. Each option has a value attribute that I use for the database and a name attribute containing the filename. They also contain the friendly name. I then have 3 divs setup like so:

The loader lets me simply get the image loading, once it has the height and width of the image it moves it to the correct box. I keep the loader div hidden so there is no moving around showing as it does its work. Does the job for what I need it to do. Which is a simple previewer of the images being selected. I need the bigger ones to be separate as these are usually tower based images and would make a ugly looking layout otherwise.