Grow your CSS skills. Land your dream job.

Last updated on:

Trim First/Last Characters in String

Remove last four characters

var myString = "abcdefg";
var newString = myString.substr(0, myString.length-4); 
// newString is now "abc"

Remove first two characters

var myString = "abcdefg";
var newString = myString.substr(2);
// newString is now "cdefg"


The substr function can be called on any string with two integer parameters, the second optional. If only one provided, it starts at that integer and moves to the end of the string, chopping off the start. If two parameters provided, it starts at the first number and ends at the second, chopping off the start and end as it is able.




  1. Joshua
    Permalink to comment#

    The snippet on this page isn’t working for me, and is throwing the following error:

    $(‘#chopper’)[0].innerText is undefined

    Just a heads up!

  2. Pauly

    i already try to click the button ” Press to chop” but nothing happen, how come?

    • Pauly (and Joshua above) – Not seeing that error, can you let me know browser/version?

    • Firefox Mac, Version 27.0.1 here, not working.
      Chrome Mac, Version 33.0.1750.146 is working.
      Safari Mac, Version 6.1.1 (7537.73.11) is working.

      So it looks like you don’t Support Firefox. Wow.
      Console says:
      Error: TypeError: $(…)[0].innerText is undefined at on line 58

  3. Permalink to comment#

    I think the code snippet for the second example has a typo:
    var myString = “abcdefg”;
    var newString = myString_2.substr(2);

    The second line of this snippet should be:
    var newString = myString.substr(2);

    Thanks for the tip!

  4. Hridayeshwar Rao

    Thanks !!

  5. Jon
    Permalink to comment#

    Any specifics on why you chose String.**substr**( start [, length ] ) rather than String.**slice**( begin [, end ] )? I did a quick search and most recommend splice as it accepts a negative value for the end point without having to calc length?

    var myString = "abcdefg";
    var newString = myString.slice(0, -4); 
    // newString is now "abc"

    slice and dice …

    Just curious!

  6. Mike
    Permalink to comment#

    Chris, it seems FF does not support innerText. textContent would be the modern equivalent:

    But since we’re using jQuery anyway why not $(…).text() :)

  7. Wesley Williams
    Permalink to comment#

    How do you do both? Meaning how do you remove the first 9 char and the last 1 char in the same string

    • Jon R. Humphrey
      Permalink to comment#

      Sorry it was late last night but I’ve strung the two string modifiers mentioned below into one line:

      var myString = "abcdefghijklmnopqrstuvwxyz";
      var newString = myString.substr(9).slice(0, -1); 
      //newString is now "jklmnopqrstuvwxy"

      Here’s a pen showing it in action

  8. Jon R. Humphrey
    Permalink to comment#

    @Wesley what about this?

    var myString = "abcdefghijklmnopqrstuvwxyz";
    var firstString = myString.substr(9);
    //firstSring is now "jklmnopqrstuvwxyz"
    var lastString = firstString.slice(0, -1); 
    //lastString is now "jklmnopqrstuvwxy"

    Does that do what you want?

    • Don

      Thanks for this code snippet. I am more up to speed with PHP rather than Javascript and was looking around how to chop a string on both ends and this worked perfectly. TY.


Leave a Comment

Current day month ye@r *

*May or may not contain any actual "CSS" or "Tricks".