показать строки после удаления с помощью jquery и выпадающего списка

Question

Я создал фильтр для удаления строк из таблицы в соответствии с сопоставлением с выбранным значением. Проблема в том, что мне нужно показать удаленные строки после того, как пользователь выберет другое значение, но я не могу понять, как это сделать. Это моя функция:

$(document).ready(function() { 
    $("button").click(function() { 
     $("td").each(function(index, paragraph) { 
      $td = $(paragraph); 
      if ($td.html() === $('select[name=select1]').val()) { 
       $(this).parent("tr:first").remove();     } 
     }); 
}); 

и это выпадающий:

<select name="select1"> 
    <option value="" disabled selected>user name</option> 
    <?php while ($line = mysql_fetch_array($result, MYSQL_ASSOC)) { ?> 
     <option value="<?php echo $line['user_name'];?>"> 
      <?php echo $line['user_name'];?> 
     </option> 
    <?php } ?> 
</select> 

Есть ли способ, я могу вернуть удаленные строки в таблице после select1 изменений?

Answer 1

Почему вы не просто изменить CSS на TR в:

display: none; 

вместо удаления? После этого вы можете добавить его в изменив его:

display: block; 

Answer 2

Вместо удаления совпавших строк, то почему бы не просто скрыть их, а затем показать все строки снова, когда значение выпадающего меняются?

$(document).ready(function() { 
    $("button").click(function() { 
     $("td").each(function(index, paragraph) { 
      $td = $(paragraph); 
      if ($td.html() === $('select[name=select1]').val()) { 
       //hide the matched row rather than remove it 
       $(this).parent("tr:first").hide(); 
      } 
    }); 
    $('select[name="select1"]').on('change', function() { 
     $("tr").show(); 
    }); 
}); 

JSFIDDLE Demo