jQuery remove selected option from this

Question

first post here, I come in peace :) I've searched but can't quite find what I'm after.

I am trying to manipulate the selected option of a select box. Can someone please explain why this works:

$('#some_select_box').click(function() {
  $('#some_select_box option:selected').remove();
});

but this doesn't:

$('#some_select_box').click(function() {
  $('this option:selected').remove();
});

I just want to use "this" instead of spelling out the id of the select box - can someone point me in the right direction for the correct syntax? It's driving me mad because it looks like it should be really simple. And I'm sure it is to someone, but not me, cos its the end of the day and I'm brain-fried... Any pointers much appreciated.

Cheers

Answer 1

this isn't a css selector. you can avoid spelling the id of this by passing it as a context:

$('option:selected', this).remove();

http://api.jquery.com/jQuery/

Answer 2

 $('#some_select_box').click(function() {
     $(this).find('option:selected').remove();
 });

Using the find method.

Answer 3

This should do the trick:

$('#some_select_box').click(function() {
  $('option:selected', this ).remove();
});

Answer 4

This is a simpler one

$('#some_select_box').find('option:selected').remove().end();