# Capitalize the first letter of each word in a string using JavaScript

By Atta Ur Rehman Shah (https://attacomsian.com/about). Published Sep 30, 2022. Topics: JavaScript.
Canonical URL: https://attacomsian.com/blog/javascript-capitalize-first-letter-of-each-word-in-string

> Learn how to use JavaScript split(), map(), and join() methods to capitalize each word in a string.

To capitalize the first letter of each word in a string using JavaScript:

1. Use the `split()` method to [split the string](https://attacomsian.com/blog/javascript-string-split) into an array using whitespace as a delimiter.
2. Use the `map()` method to iterate over the array elements.
3. Use the `slice()` and `charAt()` methods to [capitalize each element](https://attacomsian.com/blog/string-capitalize-javascript) of the array.
4. Use the `join()` method to combine all the array elements to get the capitalized string.

```javascript
const phrase = 'how to learn javascript'

const words = phrase.split(' ')

const capitalWords = words.map(str => {
  return str.charAt(0).toUpperCase() + str.slice(1)
})

const capitalStr = capitalWords.join(' ')

console.log(capitalStr)
// How To Learn Javascript
```

Alternatively, you can capitalize all words in a string using the `replace()` method with a [regular expression](https://attacomsian.com/blog/javascript-regular-expressions):

```javascript
const phrase = 'how to learn javascript'

const capitalStr = phrase.replace(/\b\w/g, c => c.toUpperCase())

console.log(capitalStr)
// How To Learn Javascript
```

The regular expression matches the first letter of each word within the given string and transforms only that letter to uppercase.

If you want to capitalize all words of a paragraph on a web page, use the CSS `text-transform` property instead: 

```css
.capitalize {
    text-transform: capitalize;
}
```

Now just add the `capitalize` class to your HTML paragraph element as shown below:

```markup
<p class="capitalize">Welcome to JavaScript tutorials!</p>
```