Reset (Clear) DropDownList selection (selected value) using jQuery

The following HTML Markup consists of an HTML DropDownList (DropDown) control and a Button. When the Button is clicked, the jQuery click event handler is executed. Inside this event handler, the SelectedIndex property of the DropDownList is set to 0 (First Item).

<select id="tutorials" style="width: 150px;">
    <option value="0">Please select</option>
    <option value="1">Html</option>
    <option value="2">CSS </option>
    <option value="3">jQuery</option>
    <option value="4">javascript</option>
    <option value="5">wordpress</option>
    <option value="6">drupal</option> 
<br />
<hr />
<input type="button" id="btnReset" value="Reset" />
<input type="button" id="btnReset" value="Reset" />
<script type="text/javascript" src=""></script>
<script type="text/javascript">
    $(function () {
        $("#btnReset").bind("click", function () {
            $("#tutorials")[0].selectedIndex = 0;

Related Post

Latest Post

Recent Posts Widget

Make sure to never miss a thing...

Get the latest news from the creative industry along with other creative goodies, conveniently delivered to social media.