javascript - テキストボックスの隣にアイコンを追加する

Question

次のボタンをクリックすると、空の場合はテキストボックスが制御されます。テキストボックスの近くに削除アイコンを追加したいと思います。これを試しましたが、うまくいきませんでした。

 $(".nextBtn").click(function () { 
      $(".txt").each(function () {
         $currentVal = $(this).val();
         if ($currentVal.length == 0 || $currentVal == $(this).attr('placeholder')) {
             //$(this).css({"backgroundColor": "black", "color": "white"});
             $('<a data-role="button"data-icon="delete"></a>').insertAfter($(this));
         }                
       });
 });

//jquery モバイル

   <div data-role="content">
            <div data-role="fieldcontainer">
                <label for:"name">Name:</label>
                <input type="text" class="txt" id="name" required placeholder="Enter your name">        

            </div>

            <div data-role:"fieldcontainer">
                <label for:"surname">Surname:</label>
                <input type="text" class="txt" id="surname" required placeholder="Enter              your surname">
            </div>  

            <div data-role:"fieldcontainer">
                <label for:"email">E-mail:</label>
                <input type="email" class="email" id="email" required placeholder="Enter your e-mail">
            </div>    
        </div>