animate width of li then return it back to default width
<p>I'm wondering if it's possible to animate the width of an LI element on hover and then return it back to the default width onmouseout. I figured I could use .css() to grab and store the default value of the width in a variable but I'm not sure where or how to declare that variable so that it would work properly in the following code. Any help would be appreciated.  thanks  </p>

<pre><code> $('#price-main-menu li').hover(function() {
$(this).animate({width:"250px"},400);
},
function() {$(this).animate({width: +a},400);
});
</code></pre>

<p>OK, I got a little further here and it looks like the key is $.data().  The following gives me an alert with the correct value in it but I don't think I'm referencing the variable correctly as the animate value.</p>

<pre><code> $('#price-main-menu li a').each(function() {
 $.data(this, 'width', $(this).css('width'));
 });

 $('#price-main-menu li a').hover(function() {
    $(this).animate({width:"250px"},400);
    },
    function() {
    var width = $.data(this, 'width');
    alert(width);
    $(this).animate({width: +width},400);
});
</code></pre>

<p>OK, answered my own question here (although stack overflow wont let me answer it).  thanks for looking though.</p>

<p>Got it.</p>

<pre><code> $('#price-main-menu li a').each(function() {
   $.data(this, 'width', $(this).css('width'));
 });

 $('#price-main-menu li a').hover(
   function() {
$(this).animate({width:"250px"},400);
   },
   function() {
var width = $.data(this, 'width');
   $(this).animate({width: width},400);
   });
</code></pre>
