How to select option in jQuery using text of option tag

Question

I'm trying to select a certain option in a select box, but it's not working:

var category = $(row + 'td:nth-child(4)').text();
$('#category_id', theCloned).load('/webadmin/video/get_categories',function(){
   $('#category_id', theCloned).val(category);
});

There's no error thrown, but it doesn't change the select box. What am I doing wrong here?

Here is an example of the options loaded by the load() call:

<option value="1">Capabilities</option>
<option value="2">Application Focus</option>
<option value="5">Fun</option>

The value of the category variable is "Fun" or "Capabilities", etc.

Answer 1

var $selectbox = $('#category_id', theCloned), // cache the element to avoid lookup overheads
    category = $(row + 'td:nth-child(4)').text();
$selectbox.load('/webadmin/video/get_categories', function(){
   $selectbox
    .find('option')
    .filter(function(){
        return $(this).text() === category;
    })
    .prop('selected', true);
});

---

Update 1

Updated the code to adjust to the code you presented in your update. This will work. However if an option will contain a part of the string and not the full string it will still be part of the selected elements. Eg If the options will be

<option value="1">Capabilities</option>
<option value="2">Application Focus</option>
<option value="5">Fun</option>
<option value="6">Fun Time</option>
<option value="6">Funhouse</option>

And the category variable will have the value Fun , all three last options will be part of the selector.

---

Update 2

Changed the code to filter the options whose text fully matches the value of the category variable. Thus, you won't have to worry about the Update 1 above.

Answer 2

At last i found a new solution Fiddle

<select>

    <option value='1'>one</option>
    <option value='2' >two</option>
    <option value='3' >three</option>
</select>

Script

$("select").on("change",function(){    
    alert($("select option:selected").text());
});

Answer 3

Try this

$('#category_id', theCloned).val($.trim(category));

Answer 4

$('#id_of_select_box').val('your_value');

this will do