I currently have a selection of buttons and on click of a button I want to add the text from the button into a text-box. Every time I click on the button I want to be able to append on to whatever I have in the input field.

What I currently have

$('#js-AddFilterOpenBracket').click(function () {
    $('#js-FilterString').val($(this).text());
});

What I'm Aiming for

$('#js-AddFilterOpenBracket').click(function () {
    $(this).text().appendTo($('#js-FilterString'));
});

I currently have a selection of buttons and on click of a button I want to add the text from the button into a text-box. Every time I click on the button I want to be able to append on to whatever I have in the input field.

What I currently have

$('#js-AddFilterOpenBracket').click(function () {
    $('#js-FilterString').val($(this).text());
});

What I'm Aiming for

$('#js-AddFilterOpenBracket').click(function () {
    $(this).text().appendTo($('#js-FilterString'));
});

• javascript
• jquery
• jquery-ui

Share Improve this question Follow asked Jun 1, 2015 at 16:04 John CoolingJohn Cooling 41544 silver badges2323 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 2

No need to use appendTo as it should be used for elements. Rather, manually append to the current value then set it

$('#js-AddFilterOpenBracket').click(function () {
    var currentVal = $('#js-FilterString').val();
    var newVal = currentVal + $(this).text();
    $('#js-FilterString').val(newVal);
});

May not be the bast way but you could do this

$('#js-AddFilterOpenBracket').click(function () {
    $('#js-FilterString').val($('#js-FilterString').val() + $(this).text());
});