jQuery set html() value

Question

HTML

<select class="selectAddress" name="select2" size="4" multiple="multiple">
    <option>address 1</option>
    <option>address 2</option>
    <option>address3, some city, uk</option>
    <option>address4, some city, uk</option>
    <option>address4, some city, uk</option>
</select>

<p id="chosenAddress01" class="renderedYellowBox">result in here</p>

jQuery

$(".selectAddress").dblclick(function() {
var address = [];
    $('.selectAddress option:selected').each(function(i, selected){ 
       address[i] = $(selected).text(); 
    });
    //alert(address);

    $('#chosenAddress01').html(address);
    });

Problem

I'm trying to get the selected value of the address option to populate the p tag on dblclick() of the address

If I use the alert box to check the result, the correct result comes thru. But trying to get the result into the p tag returns nothing.

Can anyone help?

Thanks, Kevin

Answer 1

Use .join() to turn it into a string first, like this:

$('#chosenAddress01').html(address.join(', '));

.html() treats an array differently, so best to explicitly make it a string since that's what you're after. The reason alert() works is there's an implicit .toString() going on there.

Answer 2

1. You're a brave man to use "dblclick"

2. You'll want to join the array:

   $('#chosenAddress01').html(address.join(' '));

Answer 3

Address is an array, did you try to convert into a string?