Copy to Clipboard is not working in button click event MVC5

Question

Hi i am tried Copy to clipboard function that is my requirement. so i keep one copy button near the field which i want to copy from and button on click event i try that copy the value to clipboard .But the problem is when i click the copy button its hide the field and also copy function is not working..

My View

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

@Scripts.Render("~/bundles/jQueryVal")

@Scripts.Render("~/bundles/jqueryUijs")

@Scripts.Render("~/bundles/commonJs")

@Styles.Render("~/bundles/jqueryUicss")

<div class="col-md-9">

@Html.TextBoxFor(model => model.FileName, new { @class = "form-control ", @autocomplete = "off", disabled = "disabled" })

<button type="button" class="btn btn-primary" onclick="CopyToClipboard(' #FileName')">Copy</button>

</div>

<script>

function CopyToClipboard(element){

debugger;

var $temp = $("#FileName");

$("body").append($temp);

$temp.val($(element).text()).select();

document.execCommand("copy");

$temp.remove();

}

This is the code i have tried when i click the copy button it hide the Field(FieldName) and also it didnt copy the value. Any one understand my issue and help me to resolve the problem and also tell me what mistake i did.Thanks..

javascript jquery twitter-bootstrap-3 asp.net-mvc-5