инкрементно спрятать поля ввода и текст с помощью кнопки 1

Question

У меня есть несколько полей ввода, которые генерируются динамически и прикреплены в нижней части некоторых списков. Они предназначены для пользовательского ввода вместе с выбранными объектами. Мне нужно, чтобы это можно было увеличить на 1 при каждом нажатии кнопки. Я действительно новичок в jquery, поэтому я уверен, что я где-то перепутал синтаксис, но я не совсем уверен, где. Когда я нажимаю кнопку, ничего не происходит. Что мне не хватает?

Вот мой JQuery:

var addanother; 
function increment(){ 
    addanother++; 
    $('input['.addmore'="'+ addanother +'"]').show(); 
} 

Вот мой HTML:

<input type="button" onClick="increment()" value="Add more!"/> 
<div> 
<div class="addmore1" style="display: none" /> 
<input id="<?php echo $catkey; ?>_addone_friendly_1" type="text" class="auto" size="9" /><span> - Friendly</span><br /> 
<input id="<?php echo $catkey; ?>_addone_1" name="[<?php echo $catkey; ?>][]" type="text" class="auto" size="9" /><span> - Exact</span><br /> 
</div> 
<div class="addmore2" style="display: none" /> 
<input id="<?php echo $catkey; ?>_addone_friendly_2" type="text" class="auto" size="9" /><span> - Friendly</span><br /><br /> 
<input id="<?php echo $catkey; ?>_addone_2" name="[<?php echo $catkey; ?>][]" type="text" class="auto" size="9" /><span> - Exact</span><br /><br /> 
</div> 
... and so on 
</div> 

Спасибо!

Answer 1

Для увеличения что-то, он должен начать с чем-то другим, чем undefined, и вы смешали цитаты:

var addanother = 0; 

function increment(){ 
    addanother++; 
    $('.addmore'+addanother).show(); 
} 

FIDDLE

Answer 2

Другой способ приблизиться к этому было бы избавиться от порядковых номеров , просто сделайте все из них class="addmore", и пусть jquery найдет первый скрытый и покажет его.

function increment() { 
    $('.addmore').filter(':hidden').eq(0).show() 
}