Jquery Wrapping
This is my input  i have like 120 lines of code like this one and the city names are not limited, there are 20 cities at this moment but it might go up like 40 or even 60. 

    <a href="somelink" rel="city3">Name1</a><br>
    <a href="somelink" rel="city2">Name2</a><br>
    <a href="somelink" rel="city1">Name4</a><br>
    <a href="somelink" rel="city4">Name6</a><br>
    <a href="somelink" rel="city3">Name5</a><br>
    <a href="somelink" rel="city1">Name3</a><br>
    <a href="somelink" rel="city4">Name7</a><br>
    <a href="somelink" rel="city1">Name8</a><br>

and i need this output to group them and give a title named the city they belong

    <h1>city1</h1>
    <div class="gather">
    <a href="somelink" rel="city1">Name4</a><br>
    <a href="somelink" rel="city1">Name3</a><br>
    <a href="somelink" rel="city1">Name8</a><br>
    </div>
    <h1>city2</h1>
    <div class="gather">
    <a href="somelink" rel="city2">Name2</a><br>
    </div>
    <h1>city3</h1>
    <div class="gather">
    <a href="somelink" rel="city3">Name1</a><br>
    <a href="somelink" rel="city3">Name5</a><br>
    </div>
    <h1>city4</h1>
    <div class="gather">
    <a href="somelink" rel="city4">Name6</a><br>
    <a href="somelink" rel="city4">Name7</a><br>
    </div>

i believe wrapper is the thing im looking for
Jquery Wrapping
===

This is my input  i have like 120 lines of code like this one and the city names are not limited, there are 20 cities at this moment but it might go up like 40 or even 60. 

    <a href="somelink" rel="city3">Name1</a><br>
    <a href="somelink" rel="city2">Name2</a><br>
    <a href="somelink" rel="city1">Name4</a><br>
    <a href="somelink" rel="city4">Name6</a><br>
    <a href="somelink" rel="city3">Name5</a><br>
    <a href="somelink" rel="city1">Name3</a><br>
    <a href="somelink" rel="city4">Name7</a><br>
    <a href="somelink" rel="city1">Name8</a><br>

and i need this output to group them and give a title named the city they belong

    <h1>city1</h1>
    <div class="gather">
    <a href="somelink" rel="city1">Name4</a><br>
    <a href="somelink" rel="city1">Name3</a><br>
    <a href="somelink" rel="city1">Name8</a><br>
    </div>
    <h1>city2</h1>
    <div class="gather">
    <a href="somelink" rel="city2">Name2</a><br>
    </div>
    <h1>city3</h1>
    <div class="gather">
    <a href="somelink" rel="city3">Name1</a><br>
    <a href="somelink" rel="city3">Name5</a><br>
    </div>
    <h1>city4</h1>
    <div class="gather">
    <a href="somelink" rel="city4">Name6</a><br>
    <a href="somelink" rel="city4">Name7</a><br>
    </div>

i believe wrapper is the thing im looking for