each内で定義した変数を他箇所でも呼び出したい

###前提・実現したいこと
javaScript（jQuery）初心者です。
表題の通り、jQueryの.each()内で定義した変数を、他箇所でも使用したいと思っています。

###該当のソースコード
下記の$textを、$($element).draggable({});ないしdrag: function (e, ui) {},内でも使用したいのですが、単純に呼び出しただけでは未定義のエラーとなってしまいます。

javaScript
1  var testFunc = {
2    selector: '#hoge',
3    $element: null,
4    init: function () {
5      var $element = $(this.selector);
6      $($element).each(function () {
7        var $text = $('.hogehoge').text();
8      });
9
10      $($element).draggable({
11        axis: 'x',
12        containment: 'parent',
13        drag: function (e, ui) {
14          var ttt = $('input').val();
15        },
16      });
17    },
18  };

初歩的なご質問かとは存じますが、勉強させて頂ければと思います。
何卒よろしくお願い致します。

行動規範の内容に同意します

回答1件

ベストアンサー

やりたいことはおそらくtestFuncのselectorに設定した文字列で得られるエレメント全てにdraggableを実行することですよね？でしたら以下のように、draggableをeachの中でやってしまうのがいいかと思います。

javascript
1      var $element = $(this.selector);
2      $($element).each(function () {
3        var $text = $('.hogehoge').text();
4
5        $(this).draggable({
6          axis: 'x',
7          containment: 'parent',
8          drag: function (e, ui) {
9            var ttt = $('input').val();
10            console.log($text);//大丈夫
11          },
12        });
13      });