Problemas jquery .last()

[gort123]

Hola tengo un problema, lo que quiero es seleccionar el ultimo div.separation_actions visible en cada div#comment, pero utilizando el .last() de jquery me selecciona el ultimo de todo el documento, a ver si alguien me pudiera ayudar...gracias...tengo el siguiente codigo:


<script>
$(".actions .separator_actions:visible").last().css("display", "none");
</script>

<style>
.actions a{ text-decoration: none; margin:7px;}
.actions a:hover{text-decoration: underline;}
.actions a:empty{display: none;}
.actions a:empty+.separator_actions{display: none;}
.separator_actions:last-of-type{display:none;}
.separator_actions{width: 5px; height: 5px;border-radius:5px; background-color: #0b559b; display: inline-block;}
</style>

<div id="comment1">
<div class="actions">
<a href="#">View</a>
<div class="separator_actions"></div>
<a href="#">Share</a>
<div class="separator_actions"></div>
<a href="#">Like</a>
<div class="separator_actions"></div>
<a href="#">Give</a>
<div class="separator_actions"></div>
<a href="#">You and other 4</a>
<div class="separator_actions"></div>
<a href="#">Emilio</a>
<div class="separator_actions"></div>
<a href="#">Lala</a>
<div class="separator_actions"></div>
</div>
</div>
<p>
<div id="comment2">
<div class="actions">
<a href="#">View</a>
<div class="separator_actions"></div>
<a href="#">Share</a>
<div class="separator_actions"></div>
<a href="#">Like</a>
<div class="separator_actions"></div>
<a href="#">Give</a>
<div class="separator_actions"></div>
<a href="#">You and other 4</a>
<div class="separator_actions"></div>
<a href="#">Emilio</a>
<div class="separator_actions"></div>
<a href="#"></a>
<div class="separator_actions"></div>
</div>
</div>
<p>
<div id="comment3">
<div class="actions">
<a href="#">View</a>
<div class="separator_actions"></div>
<a href="#">Share</a>
<div class="separator_actions"></div>
<a href="#">Like</a>
<div class="separator_actions"></div>
<a href="#"></a>
<div class="separator_actions"></div>
<a href="#"></a>
<div class="separator_actions"></div>
<a href="#"></a>
<div class="separator_actions"></div>
<a href="#"></a>
<div class="separator_actions"></div>
</div>
</div><p>

[Naahuel]

No es así como funciona .last(). Este método devuelve el último elemento de la selección.

Analizá la lógica. Este es tu selector:

Código Javascript:

$(".actions .separator_actions:visible")
 

Eso devolverá una colección de objetos que cumplan con ese selector. En tu caso, esto:

Código:

[
<div class=?"separator_actions">?</div>?
, 
<div class=?"separator_actions">?</div>?
, 
<div class=?"separator_actions">?</div>?
, 
<div class=?"separator_actions">?</div>?
, 
<div class=?"separator_actions">?</div>?
, 
<div class=?"separator_actions">?</div>?
, 
<div class=?"separator_actions">?</div>?
, 
<div class=?"separator_actions">?</div>?
, 
<div class=?"separator_actions">?</div>?
, 
<div class=?"separator_actions">?</div>?
, 
<div class=?"separator_actions">?</div>?
, 
<div class=?"separator_actions">?</div>?
, 
<div class=?"separator_actions">?</div>?
, 
<div class=?"separator_actions">?</div>?
, 
<div class=?"separator_actions">?</div>?
]

(copiado de la consola de Chrome)

Entonces .last() te devolverá el último elemento de esa colección.

Para hacer lo que vos querés, deberías usar algo así:

Código Javascript:

$(".actions .separator_actions:last-child")
 

Eso sí seleccionará todos los .separator_actions que son los últimos hijos de los elementos padre.