doesn't work

[kunli07]

Using .NET Core 2.0 MVC
<select class="ui dropdown"> <option value="1">Email</option> <option value="2">Text</option> </select> <script src="~/lib/jQuery/dist/jquery.js"></script> <script src="~/lib/semantic-ui-dropdown/index.js"></script> <script src="~/lib/semantic-ui-dropdown/dropdown.js"></script> <script> $('.ui.dropdown').dropdown(); </script>

and it turns into
<div class="ui dropdown selection" tabindex="0"><select> <option value="1">Email</option> <option value="2">Text</option> </select><i class="dropdown icon"></i><div class="text">Email</div><div class="menu" tabindex="-1"><div class="item active selected" data-value="1">Email</div><div class="item" data-value="2">Text</div></div></div>

it shows only "Email" and when you click on it, it doesn't do anything.

Am I referencing the js files wrong?

[Augustpi]

<div class="ui dropdown selection" ui-dropdown-x id="dd-1" tabindex="0"><select> <option value="1">Email</option> <option value="2">Text</option> </select><i class="dropdown icon"></i><div class="text">Email</div> <div class="menu" tabindex="-1"> <div class="item active selected" data-value="1">Email</div> <div class="item" data-value="2">Text</div> </div> </div>

• please import..

each time it is clicked

oninit.js

(function ($) {
	"use strict";
	
    $(document).on('click', '[ui-dropdown-x]', function (e) {
		var $target = $(this).attr('id');
		var $foo = "#" + $target;
		$($foo).dropdown();
    });

})(jQuery);