Обращение к отдельным дочерним элементам <div>
 

возможно вопрос совсем глупый, выдающий во мне полнейшего новичка, коим я и являюсь,но все же:
имеется <div id="news">, содержащий в себе несколько дочерних <div>-ов

<div id="news">
	       <div id="news-1"  class="newsImage" >
			<h3>News</h3>
			<p>Text</a></p>
		 </div>
		 <div id="news-2"  class="newsImage">
			<h3>News</h3>
			<p>text</p>
			<p><a href="#">Learn more...</a></p>
		  </div>
		  <div id="news-3"  class="newsImage">
			<h3>News</h3>
			<p>text</p>
			<p><a href="#">Learn more...</a></p>
		  </div>
                  <div id="news-4" class="newsImage">
			<h3>News</h3>
			<p>text</p>
			<p><a href="#">Learn more...</a></p>
		  </div>
                  <div id="news-5" class="newsImage">
			<h3>News</h3>
			<p>text</p>
			<p><a href="#">Learn more...</a></p>
		  </div>
</div>

Задача в том, чтобы в случае event-а .hover происходило изменение ширины <div> класса ".newsImage" и появление ранее невидимых (visibility:hidden) параграфов <p> именно в том блоке <div> на который наведен указатель мыши

$('.newsImage').hover(
	function(){
	 $('.newsImage').width('16%');
	 $(this).width('30%');
        $('.newsImage p').css('visibility','visible');
	 },
	 function(){
		 $('.newsImage').width('20%');
                 $('.newsImage p').css('visibility','hidden');
	 }
	);

Но, как вы догадываетесь при наведении мыши на блок становятся видны параграфы <p> во всех блоках класса class="newsImage", а не только в том на которой навели мышь.

Вопрос: можно ли как нибудь изолировать нужные параграфы используя "this" и обращаться только к тому, который находится в активном блоке <div>??

kreker,

$(function(){
      $('.newsImage').hover(
	function(){
	 $('.newsImage').width('16%');
	 $(this).width('30%');
        $('p', this).show();
	 },
	 function(){
		 $('.newsImage').width('16%');
         $('p', this).hide();
	 }
	);

});

Спасибо за отклик, теперя ясно как иерархия описывается в jQuerry. С Вашим вариантом и селектор visibility не нужен