How to remove clone element - jquery

Question

I want to add a remove button in my clone element for some purposes.

HTML

<div class="more">add</div>
        <div id="other_fee">
         <div>
          <input type="text" value="" name="other" placeholder="Description" />
          <input class="short3 theAmount" type="text" value="" name="other_amount" placeholder="Amount" />
          <div class="inputBlocker"></div>
         </div>
        </div>

jquery

<script type="text/javascript">
      jQuery(function($) {
        $('.more').on('click', function() {
          var $table = $('#other_fee');
          var $tr = $table.find('div').eq(0).clone();
          $tr.appendTo($table).find('input').val('');
        });

        $("#abc").each(function() {
          var form = $(this);

          form.on('keyup', '.theAmount', function() {
            var sum = 0;
            form.find('.theAmount').each(function() {
              sum += +this.value;
            });

            form.find("#other_total").val(sum);
          });
        });
      }); 


</script>

Can you post your issue with bit more details – Suganthan Madhavan Pillai Aug 07 '15 at 04:53 — Suganthan Madhavan Pillai, Aug 07 '15 at 04:53

score 0 · Answer 1 · answered Aug 07 '15 at 04:58

You can simply add this code

to HTML

`<a href=";" class="add">add</a>
 <div class="more hidden">
    <div id="other_fee">
     <div>
      <input type="text" value="" name="other" placeholder="Description" />
      <input class="short3 theAmount" type="text" value="" name="other_amount" placeholder="Amount" />
      <div class="inputBlocker"></div>
     </div>
    </div>

`

to SCRIPT

`$(document).on('click','.add',function(){
  $('.more').toggle('hidden');
});`

//or

 `$(document).on('click','.add',function(){
  if($('.more').hasClass('hidden')){
      $('.more').removeClass('hidden');
  }else{
      $('.more').addClass('hidden');
  }
});`

How to remove clone element - jquery

1 Answers1