Sync multiple select

Using jQuery to sync two multiple selects

by Michel Plungjan

HTML

<select id="foo" multiple="multiple">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
</select>

<select id="bar" multiple="multiple">
    <option value="1">Opt 1</option>
    <option value="2">Opt 2</option>
    <option value="3">Opt 3</option>
    <option value="4">Opt 4</option>
</select><br />
<a href="#" id="sel">Sync</a>

CSS

a { text-decoration:none}

JavaScript

$("#sel").click(function(e) {
  $("#bar").val($("#foo").val());
  return false;
});