Jquery - Find a select element inside a parent DIV

Question

I have a parent Div :

<div id="ctl00_MainContentAreaPlaceHolder_deliveryOpen" class="delivery_open" style="display: block;">

//Child select Element
<select class="txtfield ckgcountry" id="ctl00_MainContentAreaPlaceHolder_DeliveryPersonalInformation_country" name="ctl00$MainContentAreaPlaceHolder$DeliveryPersonalInformation$country"> 
 <option value="DE">ALLEMAGNE</option>
 <option value="TF">TERRES AUSTRALES FR.</option>
 <option value="TH">THAILANDE</option>

</select>   

</div>

I am trying to change the dropdown values selected item using :

$j("div[id*='deliveryOpen'] > .txtfield ckgcountry").removeAttr('selected');

OR

$j(".delivery_open > .txtfield ckgcountry").removeAttr('selected');

Both of these methods don't seem to work, what am i missing?, and also if theres a better (more efficient) way to achieve this?

Extra information:

I have 2 of the same elements with the same names (since its one custom control repeated). thus I cannot directly access the Select element, I have to go from the parent DIV and find the select element inside the parent DIV.

Answer 1

I think you have a syntax error in your statements - you're trying to select the dropdown by class, so the selector should be .ckgcountry instead of ckgcountry. Also, I don't see a an element that would correspond to .txtField, so that could be causing failure as well.

However, you could use this as your selector:

$("select[id$='DeliveryPersonalInformation_country']")

I'm a little confused as to what you want to do with those removeAttr('selected'); however. If you want to just select a different option, try:

$("select[id$='DeliveryPersonalInformation_country']").val("TF");

Answer 2

The following will give you access to the <select> element and allow you manipulate it's attributes. For example;

$j('.delivery_open > .txtfield.ckgcountry').attr('value', 'DE');

Or (I think this one is a safer option - based on my gut feeling)

$('.delivery_open > .txtfield.ckgcountry').attr('selectedIndex', 2);

Not entirely sure what you need to do with the <select> element, so the above examples are only a guide.