Question

<div id="cardSlots">
<div class="ui-droppable" tabindex="-1" id="card1">one</div>
<div class="ui-droppable" tabindex="-1" id="card2">two</div>
<div class="ui-droppable" tabindex="-1">three</div>
<div class="ui-droppable" tabindex="-1">four</div>
</div>

<script>
     $(".ui-droppable").each(function () {     
       if($(this).attr("id").length>0)
       {
       alert('here');
       }
    });
</script>

I am trying to loop through class but issue is i have card1 and card2 ids duplicate in that page. but above code seems to work but showing below error.

Uncaught Type Error: Cannot read property 'length' of undefined

I am trying to get ids from the loop which are there.

Answer 1

Use attribute selector selector[attribute] to get only the elements that have an ID

$('.myClass[id]')   // Get .myClass elements that have ID attribute

In your case:

$('.ui-droppable[id]').each(function(){
   alert( this.id );
});

jsFiddle demo