Adding/creating an input with javascript

I have few search forms and each form has an input value with class "search_input".

I want: on button click to add this:

<input type="submit" class="searchbtn" value="Search" />

next to each input <input type="text" class="search_input" autocomplete="off">.

Currently I am doing so using display none and on click im setting the display to block but the forms are too many so in order to save some kb's instead of typing that on every form, I'm asking if it possible with jQuery to add the input next to each .search_input

Th开发者_如何学Pythonanks alot

Using jquery it's quiet easy to add control:

$('.search_input').after($('<input type="submit" class="searchbtn" value="Search" />'));

var $input = $('<input type="submit" class="searchbtn" value="Search" />');
$(".search_input").after($input);

//OR
//$input.insertAfter(".search_input");

$("#button_id").click(function(){
  $('<input type="submit" class="searchbtn" value="Search" />').insertAfter(".search_input");
});

see docs: http://api.jquery.com/insertAfter/

$('#addSubmitButtons').click(function(e){
    $('.search_input').after('<input type="submit" class="searchbtn" value="Search" />');
});