jqeury select list item entering problem

Question

$().ready(function () {

    $('#remove').click(function () {

        return !$('#FeatureLists option:selected').remove();

    });

    $("#add").click(function () {

        var vals = $("#txtaddfeature").val();

        if (vals != '')


            $("#FeatureLists").prepend("<option value=" + vals + " selected='selected'>" + vals + "</option>");

        $("#txtaddfeature").val() = ""

    });
});

the thing is that if i enter Add it will go into the option without any problem, but if i enter Manage People only Manage will go as there is a space gap between Manage and People . how will i solve this bug?

Answer 1

option value=managed people

will only take managed as there is a space, need to have

option value='manged people'

jquery would be

$("#FeatureLists").prepend("" + vals + "");

Answer 2

Following up from what Simon Thompson said, you need to put the attributes in quotes. Also, it's good practice to use single quotes in javascript, so that you can use double quotes in attribute values. Also, you can't set the result of a function call ($("#txtaddfeature").val() = "").

$().ready(function () {
    $('#remove').click(function () {
        return !$('#FeatureLists option:selected').remove();
    });

    $('#add').click(function () {
        var vals = $('#txtaddfeature').val();

        if (vals != '')
            $('#FeatureLists').prepend('<option value="' + vals + '" selected="selected">' + vals + '</option>');

        $('#txtaddfeature').val('');
    });
});