Skip to main content
Se modificó el código para recorrer los elementos de igual nombre y se agregó botón
Origen Enlace

Quizá te ayude este código, según eso fue lo que entendí, para obtener los hijos directos de un padre, usa el método children(), y con length, obtienes la cantidad de los hijos que tiene:

$(document).ready(function() {

  console$(".logbtn-ObtenerHijos").click(function() {

    //Recorremos todos los elementos (en tu caso 'Los Padres'), y obtenemos sus respectivos hijos padre por padre
    $(""body .padre-1").childreneach().lengthfunction(); {

      //Hijos de cada elemento padre
      console.log($(".padre-2"this).children().length);

    });
  });

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='padre-1'>
  <li class='hijo-1'>Hijo 1</li>
  <li class='hijo-2'>Hijo 2</li>
  <li class='hijo-3'>Hijo 3</li>
  <li class='hijo-4'>Hijo 4</li>
</div><br><br>

<div class='padre-2'>1'>
  <li class='hijo-1'>Hijo 1</li>
  <li class='hijo-2'>Hijo 2</li>
  <li class='hijo-3'>Hijo 3</li>
  <li class='hijo-4'>Hijo 4</li>
  <li class='hijo-5'>Hijo 5</li>
  <li class='hijo-6'>Hijo 6</li>
</div>
<br>
<button class="btn-ObtenerHijos">Obtener Hijos</button>

Quizá te ayude este código, según eso fue lo que entendí, para obtener los hijos directos de un padre, usa el método children(), y con length, obtienes la cantidad de los hijos que tiene:

$(document).ready(function() {

  console.log($(".padre-1").children().length);
  console.log($(".padre-2").children().length);

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='padre-1'>
  <li class='hijo-1'>Hijo 1</li>
  <li class='hijo-2'>Hijo 2</li>
  <li class='hijo-3'>Hijo 3</li>
  <li class='hijo-4'>Hijo 4</li>
</div><br><br>

<div class='padre-2'>
  <li class='hijo-1'>Hijo 1</li>
  <li class='hijo-2'>Hijo 2</li>
  <li class='hijo-3'>Hijo 3</li>
  <li class='hijo-4'>Hijo 4</li>
  <li class='hijo-5'>Hijo 5</li>
  <li class='hijo-6'>Hijo 6</li>
</div>

Quizá te ayude este código, según eso fue lo que entendí, para obtener los hijos directos de un padre, usa el método children(), y con length, obtienes la cantidad de los hijos que tiene:

$(document).ready(function() {

  $(".btn-ObtenerHijos").click(function() {

    //Recorremos todos los elementos (en tu caso 'Los Padres'), y obtenemos sus respectivos hijos padre por padre
    $("body .padre-1").each(function() {

      //Hijos de cada elemento padre
      console.log($(this).children().length);

    });
  });

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='padre-1'>
  <li class='hijo-1'>Hijo 1</li>
  <li class='hijo-2'>Hijo 2</li>
  <li class='hijo-3'>Hijo 3</li>
  <li class='hijo-4'>Hijo 4</li>
</div><br><br>

<div class='padre-1'>
  <li class='hijo-1'>Hijo 1</li>
  <li class='hijo-2'>Hijo 2</li>
  <li class='hijo-3'>Hijo 3</li>
  <li class='hijo-4'>Hijo 4</li>
  <li class='hijo-5'>Hijo 5</li>
  <li class='hijo-6'>Hijo 6</li>
</div>
<br>
<button class="btn-ObtenerHijos">Obtener Hijos</button>

Origen Enlace

Quizá te ayude este código, según eso fue lo que entendí, para obtener los hijos directos de un padre, usa el método children(), y con length, obtienes la cantidad de los hijos que tiene:

$(document).ready(function() {

  console.log($(".padre-1").children().length);
  console.log($(".padre-2").children().length);

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='padre-1'>
  <li class='hijo-1'>Hijo 1</li>
  <li class='hijo-2'>Hijo 2</li>
  <li class='hijo-3'>Hijo 3</li>
  <li class='hijo-4'>Hijo 4</li>
</div><br><br>

<div class='padre-2'>
  <li class='hijo-1'>Hijo 1</li>
  <li class='hijo-2'>Hijo 2</li>
  <li class='hijo-3'>Hijo 3</li>
  <li class='hijo-4'>Hijo 4</li>
  <li class='hijo-5'>Hijo 5</li>
  <li class='hijo-6'>Hijo 6</li>
</div>