I'm trying to assign a margin-left to the next element's parent (line #10), but for some reason, it's not working.

Here's the relevant code:

2. var $chars = $el.children('span').addClass('sl-w1'),
3. $chars.each(function(i) {
4.    var $char = $(this);
5.    $char.wrap( $('<span/>').addClass('sl-wrapper') ) // wrap each of the words chars and set width of each wrapper = chars width
6.        .parent().css({'width' : '$char.width()' + 'px'});
7.     var initwd = $char.width();
8.     var newmar = 120 - initwd;
9.     $char.parent().css({'width': '120px !important'});  // Works
10.     $char.next().parent().css({'margin-left': -newmar + 'px !important'});  //  DOESN'T WORK                  Adjust left margin of next .sl-wrapper
11.  });

 

Here's some typical html:

1. <span class="sl-wrapper" ...>
2.   <span class="char1 sl-w1" ...>
3.   <span class="char1 sl-w2" ...>
4. </span>
5. more similar sl-wrappers ...

So what am I doing wrong?

Thanks,  Bill