cloning input text with button delete

Question

I have this script:

$(document).ready(function() {

var i = 1;

    $('#addJabatan').click(function() {
        $('.hapusJabatan:disabled').removeAttr('disabled');
        var c = $('#comboJabatan:first').clone(true);
        c.children(':text').attr('class','jabatan'+ (++i) );
        $('#comboJabatan:last').after(c);
    });

 $('#hapusJabatan').click(function() {
        if (confirm('continue delete')) {
            --i;
            $(this).closest('#comboJabatan').remove();
            $('.hapusJabatan').attr('disabled',($('#comboJabatan').length  < 2));
        }
    });

});

and this is my HTML code:

<form id="myForm">
<span id="comboJabatan" class="clonedInput">
                            <input type="button" class="hapusJabatan" value="delete" id="hapusJabatan" disabled>
    <input name="jabatan[]" type="text" data-bvalidator="required"  id="jabatan" class="jabatan1" /><br/>
                            </span>

<span>
                                <a href="#" id="addJabatan">Tambah Jabatan</a>
                            </span>

I Confused with the .length() method anyone can help me..? thanks before

for more details enter link description here

Answer 1

Try replacing this line

$('.hapusJabatan').attr('disabled',($('.comboJabatan').length  < 2));

with

if ($('.comboJabatan').length == 1)
     $('.hapusJabatan').attr('disabled', 'disabled');
else 
     $('.hapusJabatan').removeAttr('disabled');

You are also trying to select multiple elements using an ID which you cant do. I have added a class of 'comboJabatan' to the span and used that for the select.

Working example