How to select an option in multiple select box and load data from selected option

I am trying to figure out how to load data from a selected option. For example, in the multiselect dropdown box I have 3 options:

Option 1: Apple
Option 2: Orange
Option 3: Pear

Let's say I have a data list for each option. For example when I choose Apple, It will load a table in an inner div describing its price, weight and country on the first column.

When I choose the 2nd option, it will allow me to compare it with the 1st option. It should load on the 2nd column. For example:

Option  :   Apple  | Orange
Price   :   $3.95  | $2.50
Weight  :   40g    | 50g
Country :   USA    | Brazil

Would be great to know what the ideal language/method is for this? JavaScript / jQuery ?

Edit : Sorry if there's any confusion, my main question was how to do what I just described?

2012-04-05 18:27
by HMoon

Definistely jQuery - hjpotter92 2012-04-05 18:30

You definitely need javascript for that. jQuery is highly recommended - bfavaretto 2012-04-05 18:31

Is there a question here - j08691 2012-04-05 18:31

Thanks, do you know of any similar examples that can give me a headstart in the loading part - HMoon 2012-04-05 18:33

I would highly recommend that you use jQuery for this. Among other things, jQuery has excellent documentation.

2012-04-06 01:23
by Xenon

OK, but I don't have a good understanding of writing jQuery and I don't really do front-end. Having an example would help me greatly. Thanks - HMoon 2012-04-06 05:04