How can I select all options of multi-select select box on click?

Question

This is my HTML

<select name="countries" id="countries" MULTIPLE size="8">    <option value="UK">UK</option>    <option value="US">US</option>    <option value="Canada">Canada</option>    <option value="France">France</option>    <option value="India">India</option>    <option value="China">China</option> </select> <br /> <input type="button" id="select_all" name="select_all" value="Select All"> 

When user click on 'Select All' button, I want all the options in the select box to be selected

$('#select_all').click( function() {     // ? }); 

Answer 1

Try this:

$('#select_all').click(function() {     $('#countries option').prop('selected', true); }); 

And here's a live demo.