<body>
<div>
<h1>hola</h1>
<h2>Ejemplos</h2>
<ul>
<li>uno</li>
<li>dos</li>
<li>tres</li>
</ul>
</div>
<div>
<h1>adios</h1>
<h2>Ejemplos</h2>
<ul>
<li>cuatro</li>
<li>cinco</li>
<li>seis</li>
</ul>
</div>
<div>
<h1>hola</h1>
<h2>Ejemplos</h2>
<ul>
<li>uno</li>
<li>dos</li>
<li>tres</li>
</ul>
</div>
<script>
$(function () {
$('li').click(function () {
//Cambio el color del elemento clicado a rojo
$(this).css("color", "red");
//Cambio el color de los hermanos a azul
$(this).siblings().css("color", "blue");
//Cambiar el color del hermano del padre h1
$(this).parent().siblings("h1").css("color", "green");
//Cambiar el color de los otros li's a gris
$(this).parents("div").siblings().find("li").css("color", "grey");
//Cambiar el color de los otros h1 a negro
$(this).parents("div").siblings().find("h1").css("color", "black");
});
});
</script>
</body>
