<span class="share">
                            <ul>
                                <li>Share &nbsp;&nbsp;</li>
                                <li class="twitter"><a href="#">twitter</a></li>
                                <li class="facebook"><a href="#">facebook</a></li>
                                <li class="delicious"><a href="#">delicious</a></li>
                                <li class="friendfeed"><a href="#">friendfeed</a></li>
                                <li class="addthis"><a href="#">share</a></li>
                                <div class="clear"></div>
                            </ul>
                        </span>

.twitter {background:url('../images/tt.png') no-repeat; width:10px; height:14px; }

.twitter a, .twitter a:link, .twitter a:visited
{
    color: transparent;
}

.twitter a {
    display: inline-block;
    overflow: hidden;
    width: 0;
    height: 14px;
    padding-left: 10px;
}

text-indent: -9999px; /* get rid of any text */

<script>
    $('.twitter a').html('');
</script>

<span class="share">
                <ul>
                    <li>Share &nbsp;&nbsp;</li>
                    <li class="twitter"><a href="#" class="twitter">twitter</a></li>
                    <li class="facebook"><a href="#">facebook</a></li>
                    <li class="delicious"><a href="#">delicious</a></li>
                    <li class="friendfeed"><a href="#">friendfeed</a></li>
                    <li class="addthis"><a href="#">share</a></li>
                    <div class="clear"></div>
                </ul>
            </span>

a.twitter {
    background-image:url('../images/tt.png');
    display:block;
    height:58px;
    text-indent:-9999px;
    width:200px;
}