About accordion's header's background
hello,
I have a list of data using accordion, each data in the list contains header and detail.
I looked at "ui.accordion.css" and found that I have to do something in this line :
.ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 1px; zoom: 1; }
I tried to add "background: #cccccc url(images/ui-bg_highlight-soft_75_cccccc_1x100.png) 50% 50% repeat-x" in the css code above and it work. The headers' background are changed.
But how can I change some of the header's background not all?
this is my html code:
<script type="text/javascript">
var $j = jQuery.noConflict();
$j(function() {
$j("#accordion").accordion({
collapsible: true
});
});
</script>
<body>
<div id="accordion">
<h3> list 1 </h3>
<p>
this is list 1
</p>
<h3> list 2 </h3>
<p>
this is list 2
</p>
<h3> list 3 </h3>
<p>
this is list 3
</p>
<h3> list 4 </h3>
<p>
this is list 4
</p>
</div>
How can I change background only <h3>list 2 </h3>, for example, to plain orange color while other are still using url(images/ui-bg_highlight-soft_75_cccccc_1x100.png)
Sorry I'm not good at English gramma