JQuery помочь добавить HTML не работает

Question

Я пытаюсь добавить этот HTML также при добавлении поля ввода:

<div id="redDiv" style="width:30px;height:30px;margin-top:10px;display:block;background:red;"></div>
<div id="greenDiv" style="width:30px;height:30px;margin-top:10px;display:block;background:green;"></div>

Мой нередактированный Jquery http://jsfiddle.net/gDChA/23/:

function findLastInput ( element ) {
  return $( element ).parent().prev().find('input').last();
}
    $('button.add').click ( function(e) {
        $(this).parent().find('button.remove').show();
        $(this).hide();

        var element = findLastInput(this).clone();
        var name = element.prop('name');
        var pattern = new RegExp(/\[(.*?)\]/);
        var info = name.match(pattern)[1];
        element.prop({
          'value': '',
          'name' : name.replace(pattern, '[' + info + 'info' + ']'),
          'id'   : element.prop('id') + 'info',
          'type' : 'input',
          'class' : 'infoinput'
        });    
        $(this).parent().append(element);
    })
    $('button.remove').click ( function(e) {
        $(this).parent().find('button.add').show();
        $(this).hide();
        //findLastInput(this).remove('input');
        $(this).parent().find("input").remove();
    });

Сначала я попытался добавить дополнительный HTML без удачи. Я редактировал это $(this).parent().append(element);

На это и не работает:

$(this).parent().append(element + '<div id="redDiv" style="width:30px;height:30px;margin-top:10px;display:block;background:red;"></div>
    <div id="greenDiv" style="width:30px;height:30px;margin-top:10px;display:block;background:green;"></div>');

Я хочу добавить HTML-код и удалить его так же, как работает поле ввода.

Answer 1

Вероятно, вам нужно добавить дополнительный html в element.html () вместо элемента (элемент - это просто объект, возвращаемый из вашей функции findLastInput), поэтому он должен выглядеть примерно так:

$ (this) .parent (). append ( element.html () + '');