Buongiorno

in una struttura dove mostro una serie di immagini e ognuna di esse è impostata con una struttura simile

codice HTML:
<div class="contenitore">
  <img src=... />
  <div class="azione"></div>
</div> 
Quando si posiziona il mouse sopra viene reso visibile il div interno che copre per intero l'immagine. Al click su di essa parte una richiesta AJAX e al termine della stessa, se tutto è andato a buon fine, vorrei che venisse eliminato l'intero div contenitore.

Ora se faccio così (uso la libreria jQuery)

codice:
$('#contenitore div').click(function(){
  var elem = $(this).parent();
  elem.remove();
});

funziona e il div viene eliminato.

Se invece proseguo con la chiamata ajax così

codice:
$('#contenitore div').click(function(){
   var elem = $(this).parent();
   
   $.ajax({
      [...]
      success: function(data) {
         if(data == 'OK') {
            elem.remove();
         }
   });

Pur essendosi correttamente conclusa la chiamata AJAX, l'elemento non viene eliminato.

Suggerimenti?