Fynn Fynn - 6 months ago 63
HTML Question

JQuery UI: How to remove Icon from specific Accordion group?

I would like to remove the icon from a specific group in my JQuery UI Accordion, but the icons seem to be set in a quite difficult way in the JS.
I figured that using

"icons : false"
inside my Jquery-function would turn off the icons for all the groups inside my accordion, but i would like to turn them off only for specific ones (in this case, the last group called "single Section"), is that possible?

$(function() {
$( "#accordion" )
.accordion({
header: "> div > h3",
icons: false

})
.sortable({
axis: "y",
handle: "h3",
stop: function( event, ui ) {
// IE doesn't register the blur when sorting
// so trigger focusout handlers to remove .ui-state-focus
ui.item.children( "h3" ).triggerHandler( "focusout" );

// Refresh accordion to handle new order
$( this ).accordion( "refresh" );
}
});
});


Here is the jsfiddle to the full code.

Shl Shl
Answer

You can do this via CSS

.device .ui-accordion-header-icon {
    display: none !important;
}

You can add a class for single accordions group and control via CSS