Как обернуть дополнительные ссылки с помощью div с помощью jquery?

Question

Привет, я пытаюсь обернуть ссылки в div, если есть более 4 ссылок в родительском div с jquery

<div class="acclinks">
   <a href="#">1</a>
   <a href="#">2</a>
   <a href="#">3</a>
   <a href="#">4</a>
   <a href="#">5</a>
   <a href="#">6</a>
   <a href="#">7</a>
   <a href="#">8</a>
</div>

Я хотел быть таким

<div class="acclinks">
       <a href="#">1</a>
       <a href="#">2</a>
       <a href="#">3</a>
       <a href="#">4</a>
       <div class="more">
          <a href="#">5</a>
          <a href="#">6</a>
          <a href="#">7</a>
          <a href="#">8</a>
       </div>
    </div>

Answer 1

Использование :gt() selector, to select element with index great that specific number. Тогда используйте .wrapAll() to wrap selected elements in new html.

$(".acclinks a:gt(3)").wrapAll("<div class='more'></div>");

$(".acclinks a:gt(3)").wrapAll("<div class='more'></div>");

.more { border: 1px solid red }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="acclinks">
   <a href="#">1</a>
   <a href="#">2</a>
   <a href="#">3</a>
   <a href="#">4</a>
   <a href="#">5</a>
   <a href="#">6</a>
   <a href="#">7</a>
   <a href="#">8</a>
</div>