Tengo algunas etiquetas de elementos de lista en mi jsp. Cada elemento de la lista tiene algunos elementos en su interior, incluido un enlace (etiqueta "a") llamado eliminar. Todo lo que quiero es eliminar todo el elemento de la lista cuando hago clic en el enlace.

Aquí está la estructura de mi código:

$("a").click(function(event) {
  event.preventDefault();
  $(this).parent('.li').remove();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li id="191" class="li">
  <div class="text">Some text</div>
  <h4><a href="URL">Text</a></h4>
  <div class="details">
    <img src="URL_image.jpg">
    <span class="author">Some info</span>
    <div class="info"> Text
      <div class="msg-modification" display="inline" align="right">
        <a name="delete" id="191" href="#">Delete</a>
      </div>
    </div>
  </div>
</li>

Pero esto no funciona. Soy nuevo en jQuery, así que probé algunas cosas, como por ejemplo:

$(this).remove();

Esto funciona, elimina el enlace al hacer clic.

$("#221").remove();

Esto funciona, elimina el elemento de lista indicado, pero no es "dinámico".

¿Puede alguien darme una propina?