Check if an element doesn't exist and append it

Question

I want select all items that haven't an IMG tag and append it. I can do that:

How can i do that?

  <div class="test">
     <div class="someDummydiv"></div>
  </div>
  <div class="test">
     <div class="someDummydiv"></div>
     <img src="try.gif" />
  </div>
  <div class="test">
     <div class="someDummydiv"></div>
  </div>
  <div class="test">
    <div class="someDummydiv"></div> 
    <img src="try.gif" />
  </div>
  <div class="test">
     <div class="someDummydiv"></div>
  </div>
  <div class="test">
     <div class="someDummydiv"></div>
     <img src="try.gif" />
 </div>

Result -->

  <div class="test">
     <div class="someDummydiv"></div>
     <img src="try.gif" />
  </div>
  <div class="test">
     <div class="someDummydiv"></div>
     <img src="try.gif" />
  </div>
  <div class="test">
     <div class="someDummydiv"></div>
     <img src="try.gif" />
  </div>
  <div class="test">
     <div class="someDummydiv"></div>
     <img src="try.gif" />
  </div>
  <div class="test">
     <div class="someDummydiv"></div>
     <img src="try.gif" />
  </div>
  <div class="test">
     <div class="someDummydiv"></div>
     <img src="try.gif" />
  </div>

Thank you very much

Nick Craver · Accepted Answer · 2010-06-25 16:39:19Z

9

You can use a selector that checks for existence using :not() and :has(), and append to those, like this:

$('.test:not(:has(img))').append('<img src="try.gif" />');

Just replace the selector inside the :not(:has(selector)) to look for what you want to .append().

answered Jun 25, 2010 at 16:39

Nick Craver

631k138 gold badges1.3k silver badges1.2k bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

g.d.d.c Over a year ago

That's really clean. My approach should work as well, and would allow extra processing for elements that don't have images as well, but a one liner is always nice. :)

g.d.d.c · Accepted Answer · 2010-06-25 16:39:34Z

1

This should come close:

$('div.test').each(function () {
  var $this = $(this);
  if ($this.children('img').size() == 0) {
    $this.append('<img src=try.gif>');
  }
});

answered Jun 25, 2010 at 16:39

g.d.d.c

48.3k12 gold badges105 silver badges116 bronze badges

Collectives™ on Stack Overflow

Check if an element doesn't exist and append it

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related