Font-Удивительный значок с событием OnClick установить

Question

Я пытаюсь использовать следующую FONT-устрашающий Icon

<i class="fa fa-minus-circle"></i> 

как значок удаления рядом элементов в списке на моей странице, как это:

Item 1 delete-icon 
Item 2 delete-icon 

по щелчку одного из этих значков, мне нужно, чтобы запустить функцию JavaScript ...

Какой элемент HTML я должен оберточной значок с? Я заметил, что когда я использую тег привязки, он становится синим, и когда я использую кнопку, она оказывается завернутой в кнопку. Есть ли другие варианты?

По существу я хочу сделать это

<a onclick="Remove()"><i class="fa fa-minus-circle"></i></a> 

или это

<button onclick="Remove()"><i class="fa fa-minus-circle"></i></button> 

Но есть только значок появляется как без каких-либо модификаций. Нет синего цвета, и он не обернут внутри кнопки.

Answer 1

Просто используйте div тег или span тег с onclick

<div onclick="myFunction()"> 
     <i class="fa fa-minus-circle"></i> 
</div> 

или

<span onclick="myFunction()"> 
    <i class="fa fa-minus-circle"></i> 
</span> 

Answer 2

Либо удалить синий контур из тега привязки with CSS или установить onclick -handler на удивительном значок шрифта само по себе:

<i class="fa fa-minus-circle" onclick="Remove()"></i> 

Answer 3

Здесь можно использовать шрифт awesome с бутстрапом.

{{#if currentUser}} 
    <a class="btn btn-large btn-primary logout" href="#"> 
     <i class="fa fa-sign-out" aria-hidden="true">Logout</i> 
    </a> 
{{else}} 
    <a href="/login" class="btn btn-primary login-toggle">Register/Login</a> 
{{/if}} 

корреспондент JS, чтобы сделать событие щелчка на LOGOUT кнопку

'click .logout':() =>{ 
//your JS functionality. 
}