jQuery parent and child selector

Question

I'm trying to use this selector it its not working for me

var pr = $(this).closest('fieldset');
$( pr + ' > .given option:selected').remove().appendTo(pr + ' > .allowed');

I get this error

Error: uncaught exception: Syntax error, unrecognized expression: [object Object]

why does this not work the way I expect it to ?

Answer 1

The problem with your code is that pr is not a string. Therefor you cannot add it to the rest of your selector.

This should work:

$('.given option:selected', pr).remove().appendTo($('.allowed', pr));

This will force jQuery to search in the context of pr

Answer 2

You seem to be mixing jQuery objects and selectors.

the pr variable becomes a javascript (jQuery) object after this line:

var pr = $(this).closest('fieldset');

And then you are appending this object to a new selector, which is not how it should be done. If I understand your intent right, try the following:

var pr = $(this).closest('fieldset');
pr.filter('.given option:selected').remove().appendTo(pr.filter('.allowed'));