Move two sortable objects in different list to the same position by their class

I have two lists of sortable objects

1         1 (1A 1B)
2 (2A 2B) 2 
3         3 (3A 3B)
4 (4A 4B) 4
5         5 (5A 5B)

The code for the lists look like this:

$( function() {
    $( ".contain" ).sortable();

     } );

.contain{
list-style: none;
}

#right{
float: left;
}

#left{
float: left;
}

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<div>
     <div>
      <ul id="left" class="contain">
       <li class="1">1</li>
       <li class="2">2</li>
       <ul>
           <li>2A</li>
           <li>2B</li>
       </ul>
       <li class="3">3</li>
       <li class="4">4</li>
          <ul>
           <li>4A</li>
           <li>4B</li>
          </ul>
       <li class="5">5</li>
      </ul>
     </div>

     <div>
      <ul id="right" class="contain">
       <li class="1">1</li>
          <ul>
           <li>1A</li>
           <li>1B</li>
          </ul>
       <li class="2">2</li>
       <li class="3">3</li>
          <ul>
           <li>3A</li>
           <li>3B</li>
          </ul>
       <li class="4">4</li>
       <li class="5">5</li>
          <ul>
           <li>5A</li>
           <li>5B</li>
          </ul>
      </ul>
     </div>
    </div>

I would like to sort the same numbers together. For example, if I were to take the 5 in list "left" and move it to the top, then the 5 in list "right" should also move to the top, and the reverse is true as well if I were to take the 3 from list "right" and move it to the top, then the 3 in list "left" would do the same.

from Move two sortable objects in different list to the same position by their class