Eu criei no Jquery uma função para expandir e recolher o conteúdo de uma div. Mas agora eu gostaria de fazê-lo apenas com CSS e também usar a imagem de uma seta, como essas

Ver ao vivojsFiddle

Eu também gostaria de eliminar todas essas extensões de tag e manter apenas a div e seu conteúdo

Aqui o código que tenho até agora.

<div class='showHide'>
    <span class='expand'><span id="changeArrow">&#8593;</span>Line expand and collapse</span>
    <fieldset id="fdstLorem">Lorem ipsum...</fieldset>
</div>

$(document).ready(function () {
    $('.showHide>span').click(function () {
        $(this).next().slideToggle("slow");
        return false;
    });
    $(".showHide>span").toggle(function () {
        $(this).children("#changeArrow").text("↓");
    }, function () {
        $(this).children("#changeArrow").text("↑");
    });
});