Como posso ter o comportamento de anexar jquery a um elemento depois de inseri-lo

Eu tenho um formulário que eu envio através do ajax e retorna um pedaço atualizado de html que inclui um formulário atualizado que eu quero enviar através do jquery.

O problema que estou tendo é que a primeira vez que clico em enviar o evento é capturada pelo jquery e funciona muito bem. Quando faço outra alteração no formulário sem atualizar, o evento não é capturado pelo jquery, mas faz uma solicitação de postagem padrão.

Como posso ter o comportamento de anexar jquery a um elemento depois de inseri-lo.

Aqui está o meu código de jquery.

$('.edit_clothing_product').submit(function(){
  var productDiv = $(this).parent();
  var action = $(this).attr('action');
  var formData = $(this).serialize();

  $.post(action, formData, function(data){
  productDiv.replaceWith(data);
  });
  return false;
 });

Aqui está o (aparado para baixo) HTML que eu volto.

<div class="product">
    <form action="..." class="edit_clothing_product">
      <div class="color_combos">
        ...{form fields}
      </div>
      <a href=".../add_color_combo" class="add_color_combo">Add Color Combo</a>
    <input name="commit" type="submit" value="Save" />
  </form>
</div>

questionAnswers(2)

yourAnswerToTheQuestion