¿Cómo cambiar el icono de un nodo JStree utilizando solo css?

Question

Estoy tratando de averiguar cómo cambiar el icono de un nodo JStree usando solo css? Hay muchas publicaciones que explican cómo hacerlo con javascript pero prefiero usar css solamente.

Aquí está mi código hasta ahora:

$("#treeview").jstree().on('loaded.jstree', function() 
{ 
    $("#treeview").jstree('open_all'); 
}); 

Y el HTML:

<div id="treeview"> 
    <ul> 
    <li> 
     <a href="#">abcdefghijkl</a> 
     <ul> 
     <li> 
      <a href="#" onclick="goTo('index.php?module=klimaat&amp;pagina=dashboard&amp;id=6',false);"> 
      Beneden</a> 
     </li> 
     <li> 
      <a href="#" onclick="goTo('index.php?module=klimaat&amp;pagina=dashboard&amp;id=7',false);"> 
      Boven</a> 
     </li> 
     </ul> 
    </li> 
    </ul> 
</div> 

Por CSS estoy usando la hoja de estilo por defecto entregado por jstree. La documentación proporcionada por jstree es realmente horrible. Así que stackoverflow es de gran ayuda, pero no pude encontrar este en el sitio web.

Si necesita más código o información, por favor pregunte. Gracias

Answer 1

Sólo hay que incluir esto en el CSS:

a .jstree-icon 
{ 
    background-image: url("yourimage.png")!important; 
    background-position: 0!important; 
} 

This is a fiddle de funcionar correctamente (actualizado 2016):