Using the very popular <a target="_blank" href="https://github.com/tpope/vim-surround"><code>vim-surround</code></a> plugin, we can accomplish this task easily.
Here, we have five anchor tags. 
<pre><code>&lt;a href="#"&gt;Home&lt;/a&gt;
&lt;a href="#"&gt;About&lt;/a&gt;
&lt;a href="#"&gt;Gallery&lt;/a&gt;
&lt;a href="#"&gt;Contact&lt;/a
&lt;a href="#"&gt;Others&lt;/a
</code></pre>In order to wrap all of them between a <code>nav</code> element, we have to first select all five anchor elements by using linewise visual mode and then type <code>S&lt;nav&gt;</code>.
<pre><code>&lt;nav&gt;
 &lt;a href="#"&gt;Home&lt;/a&gt;
 &lt;a href="#"&gt;About&lt;/a&gt;
 &lt;a href="#"&gt;Gallery&lt;/a&gt;
 &lt;a href="#"&gt;Contact&lt;/a
 &lt;a href="#"&gt;Others&lt;/a
&lt;/nav&gt;
</code></pre>

Using the very popular [`vim-surround`](https://github.com/tpope/vim-surround) plugin, we can accomplish this task easily.

Here, we have five anchor tags. 

```
<a href="#">Home</a>
<a href="#">About</a>
<a href="#">Gallery</a>
<a href="#">Contact</a
<a href="#">Others</a
```

In order to wrap all of them between a `nav` element, we have to first select all five anchor elements by using *linewise visual mode* and then type `S<nav>`.

```
<nav>
 <a href="#">Home</a>
 <a href="#">About</a>
 <a href="#">Gallery</a>
 <a href="#">Contact</a
 <a href="#">Others</a
</nav>
```

Shailesh Kumar Sundram

Shailesh Kumar Sundram

How to Wrap HTML Element(s) With Another HTML Element in Vim