jQuery using 'this' in an if statement

Question

I'm using an if statement in order to determine if an element has any children. If it does NOT have any children, I want to do something to that element only.

Here's the premise of what I'm trying to do:

if ($("#div a").children().length > 0){
    $(this).hide();
}

So if an <a> tag has no children, I want to do something to that specific element (or multiple elements that also have no children).

The problem is that this hasn't been defined because it's an if statement.

I could be completely missing something but I'm not quite sure how to accomplish this. Any advice would be appreciated

Answer 1

Edit: Added DEMO Link

You can use .filter to check the condition and call .hide on the filter results. See below,

$("#div a").filter(function () {
  return ($(this).children().length > 0)
}).hide();

Answer 2

Simple solution is to place the element in a variable.

var elem = $("#div a");
if (elem.children().length > 0){
    elem.hide();
}

Answer 3

you could use each to iterate through elements

$('input').each(function(){
  if ($(this).val()) {
    $(this).addClass('has-value');
  }
});