Changer le bouton pour l'image en fonction du texte en utilisant jquery?

Question

J'ai une page de paiement sur ma boutique en ligne, et l'un des champs est un pour un code de coupon de réduction, à côté de laquelle est un bouton «mettre à jour le total». La colonne suivante montre la réduction.

  --------------- —————————————— 
enter code:|    | |update total|   - $0.00 
      --------------- —————————————— 

Lorsque l'utilisateur entre un code correct et presses mettre à jour la page se charge à nouveau avec le montant de la remise correcte:

  --------------- —————————————— 
enter code:| 1234  | |update total|   - $10.00 
      --------------- —————————————— 

Je veux que l'utilisateur de voir une image tick au lieu du bouton, de sorte qu'ils ne pas confondre et cliquez à nouveau mettre à jour, comme ceci:

  ---------------  
enter code:| 1234  |  tick image   - $10.00 
      ---------------  

Est-il possible de le faire avec jquery? Je suppose que ce serait vérifier le montant pour voir si elle n'a pas été 0. Le html ressemble à peu près comme ceci:

<td> 
<input type='text' class='couponinput' name='coupon_num' id='coupon_num' value='' /> 
<input type='submit' class='update-button' value='Update' /> 
</td> 
<td class="lastcolumn"> 
<span id="coupons_amount" class="pricedisplaycart" style="font-weight:bold; color:black;" >-&#163;0.00</span> 
</td> 

Answer 1

Cacher et insérer dans l'image après (qui remplace essentiellement elle) ...

$('input[type=submit]').hide().after('<img src="tickImage.jpg" />");