Animate text alignment using jquery

Question

At the click of a button $(\'#btn\').click(), I want a group of span elements be set with CSS text-align right (originally text-aligned left) and m

Answer 1

HTML markup (no change)

    

        Strings
    
    

        Strings
    

CSS markup

.info {
    display: block;   /* width works better on block level elements */
    text-align: right;
    width: 20%;       /* use something sensible as the default value */
    overflow: hidden; /* if you choose 0% for the above property then use this */
}

jQuery code

$(document).ready(function() {
    $(".info").animate({
        width: "100%"
    }, 1000);
});

Demo here

PS: I'd rather use CSS position relative+absolute along with CSS overflow+left properties.