How to get value and remove text box jQuery

Question

I created a text box and appended it to my div:

    $('<input />').appendTo("#box")

I would like to get the value inputted from the user.

I would also like to remove the text box too. I tried this:

    $('<input />').remove();

but no luck. Any ideas? Thanks a lot.

possible duplicate of [CSS selector for text input fields?](http://stackoverflow.com/questions/4113965/css-selector-for-text-input-fields) — Ram, Aug 17 '13 at 14:24

score 3 · Answer 1 · answered Aug 17 '13 at 14:18

3

$(function() {
    $('#box').on('change','input:text',function() {
        var userInput = $(this).val();
        $(this).remove();
    });
});

answered Aug 17 '13 at 14:18

DevlshOne

8,357
1
29
37

score 1 · Accepted Answer · answered Aug 17 '13 at 14:15

You'd want to try

$("#box").find("input").remove();

And if you've got some other text boxes which you dont want to remove in #box, add an id or a class to the input when you are appending it to #box.

 $('<input />', { "class" : "remove-soon" }).appendTo("#box");

Then, you could use that class as a selector to remove it.

$("#box").find(".remove-soon").remove();

To get the value of the textbox you'd use,

$("#box").find(".remove-soon").val();

Amith · Answer 3 · 2013-08-17T17:12:40.140

1

JSbin working code http://jsbin.com/aVuVedA/1/edit

get input value

var user_value = $('#box input').val();

remove

$('#box input').remove();

edited Aug 17 '13 at 17:12

answered Aug 17 '13 at 14:16

Amith

1,424
1
10
22

How to get value and remove text box jQuery

3 Answers3