Vamos a ver un selector JQUERY especial, que solo se encarga de seleccionar todos los encabezados: h1, h2, h3, h4, h5, h6. Mediante el selector :header.
Ejemplos, selector :header
<!DOCTYPE html>
<html>
<head>
<title>Selector de encabezados</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#miId').click(function(){
$(':header').css({"border":"1px solid red"});
});
});
</script>
<style>
*{
width: 100%;
margin: 0 auto;
}
</style>
</head>
<body>
<h1 id='miId'>Seleccionar todas los encabezados (en este ejemplo 2: h1, y h2)</h1>
<ul class="uno">
<li>
Lista 1
</li>
<li>
Lista 2
</li>
<li>
Lista 3
</li>
<li>
Lista 4
</li>
<li>
Lista 5
</li>
</ul>
<h2>Esto es un encabezado</h1>
<ul class="dos">
<li>
Lista 1
</li>
<li>
Lista 2
</li>
<li>
Lista 3
</li>
<li>
Lista 4
</li>
<li>
Lista 5
</li>
</ul>
</body>
</html>
Nuevamente el código necesario no es más que una línea, el resto es código HTML y CSS.
$(':header').css({"border":"1px solid red"});
En este ejemplo seleccionamos todos los encabezados, podríamos indicar solo los que estén dentro de otra etiqueta:
$('#cabeceras:header').css({"border":"1px solid red"});