トグルボタンのアイコンが表示されない

Question

前提・実現したいこと

トグルボタンのアイコンにjqueryの↓のアイコン
https://fontawesome.com/icons/bars?style=solid
を読み込ませたいです。

発生している問題・エラーメッセージ

トグルボタン自体は表示できているが、アイコンが見えない。

該当のソースコード

https://codepen.io/suzuki_trc/pen/PRWQyy

試したこと

jqueryのバージョンを変更してみたりしたのですが、表示されませんでした。

補足情報（FW/ツールのバージョンなど）

<link href="http://netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.css" rel="stylesheet"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

Answer 1

バージョンがあってません。v4はこちらです。
https://fontawesome.com/v4.7.0/icon/bars/

<i class="fa fa-bars" aria-hidden="true"></i>

Answer 2

「#menubtn i」にfont-family: FontAwesome;が指定されていないからだと思います。

	#menubtn i {
		color: #888888;
		font-family: FontAwesome;/* 追加 */
		font-size: 18px;
	}

あと、CSSのリンクは、「https://〜」かダブルスラッシュ（//netdna.bootstrapcdn.com/〜）で書いておいた方がいいと思います。

Comments

[kszk311]

あと、「@media (min-width: 768px) { ... }」の閉じかっこ（最後）、全角になってませんか？

Answer 3

ヘッダのリンクが間違っているのではないですか？

<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">

でやったところアイコンは表示されました。
以下のサイトを参照してみるといいかと思います。
参照：https://saruwakakun.com/html-css/basic/font-awesome