:selected Selector

Syntax

$(":selected")

Description

":selected" selector is used to select all the form elements of input type selected. The below example shows how to change the style of a selected element in a form using the :selected selector in JQuery.

Example Code

<br>Click on Test and Pull down the drop-down menu to see the change in style of the selected item.<br><script type="text/javascript" src="jquery.js"></script> <link href='http://hscripts.com/style-new.css' rel='stylesheet' type='text/css'> <script type="text/javascript"> function test(){ $("#sel_exp option:selected").css("background-color","green"); }; </script> <form class='frms' style='border:none;' action="registration"><br>Nickname: <input type="text" name="user" /> <br>Password: <input type="password" name="password" /> <br>Country: <select multiple="multiple" id="sel_exp"> <option>Africa</option> <option selected="selected">India</option> <option>Nigeria</option> <option>Pakistan</option> </select> <br><input type="checkbox" name="option1" value="accept" checked>Accept Terms<br><input type="checkbox" name="option2" value="newsletter" checked>Newsletter<br><input type="checkbox" name="option3" value="emails">Emails<br></form> <input type="button" class="btntest" value="Test" onclick="test();"><br>