How to Surround Text With an HTML Element With Vim

2022-10-07
By: O. Wolfson

If you're working with VS Code and the VsCode Vim extension, you can use Vim commands to quickly wrap a line of text in an HTML element. Here's how to do it:

  1. Enter visual mode by pressing the v key.

  2. Highlight the text you want to wrap.
  3. Press S (capital S).

  4. Enter the HTML element you want to wrap the selected text with, like this for <div>: <div>.

This will wrap the selected text in the specified HTML element. For example, if you had the following line of text:

javascript
This is a line of text.

And you wanted to wrap it in a div, you would highlight the text and press S <div> to get:

javascript
<div>This is a line of text.</div>