I have a jquery headline like this:
<div class="mainGallery">
<div class="main">
<div class="mainDesc">
<h2> </h2>
<a class="mainA" href="#"> </a> </div>
<ul class="pg">
<li> 1 <a href="#" rel="Headline Title 1"></a> <span rel="Headline Lorem1 ipsum dolor sit amet"></span>
<p rel="images/1.jpg"></p>
</li>
<li> 2 <a href="#" rel="Headline Title 2"></a> <span rel="Headline Lorem ipsum2 dolor sit amet"></span>
<p rel="images/2.jpg"></p>
</li>
<li> 3 <a href="#" rel="Headline Title 3"></a> <span rel="Headline Lorem ipsum3 dolor sit amet"></span>
<p rel="images/3.jpg"></p>
</li>
<li> 4 <a href="#" rel="Headline Title 4"></a> <span rel="Headline Lorem ipsum4 dolor sit amet"></span>
<p rel="images/4.jpg"></p>
</li>
</ul>
</div>
<div class="mainImg"><img src=""/></div>
</div>
My jquery is:
$(document).ready(function(){
$('.pg li').click(function(){
var header = $(this).find('a').attr('rel');
var desc = $(this).find('span').attr('rel');
var images = $(this).find('p').attr('rel');
$(".mainDesc h2").text(header);
$(".mainDesc a").text(desc);
$(".mainImg img").attr("src", images);
}
);
}
);
Everything is ok, But when refreshing the page, the first item is missed. I want insert only one mysql query in this section.
How can I fix this for showing first item when page refreshed.
Thanks