Параметр в функцию - элемент DOM

[Frozen Coyote]

Добрый день, подскажите пожалуйста, как реализовать штуку такую:

Есть функция js получающая в себя единственный параметр - элемент

makeHTML($(myEl))

сама функция создает допустим кнопку и добавляет ее в DOM. У кнопки есть параметр onclick который вызывает функцию start, которая должна получить в себя этот вот самый myEl. Подскажите плиз, как этот el внутри makeHTML передать в start? как мне преобразовать пришедший этот el и во что?

function makeHTML(el)
{
$("body").append("<button onclick=\"start(el)\">Моя кнопка</button>") // неправильный вариант и понятно почему
}

[Decode]

Frozen Coyote, даже если сделать так:

$("body").append('<button onclick="start(' + el + ')">Моя кнопка</button>');

Элемент будет преобразован к строке.

ИМХО, лучше сделать так: http://codepen.io/anon/pen/vKYEjb?editors=1010

[DynkanMaclaud]

Frozen Coyote,

function makeHTML(el){
  
  $('body').append('<button onclick="start(elem)">Моя кнопка</button>');
  return el[0];
  
}
function start(el) {

	alert(el.innerHTML);

}
var elem = makeHTML( $('div'));

Вставлять код в конец body!

[Frozen Coyote]

$("body").append('<button onclick="start(' + el + ')">Моя кнопка</button>');

Спасибо. Ваше решение я вначале и сам планировал, но мне стало интересно - можно ли оформить передачу не самого объекта DOM, а к примеру что то вроде ссылки на него? Ибо если кнопка одна, как я привел в примере - это одно, а если допустим эта кнопка - "удалить строку" в таблице, где этих строк будет 100500 - не очень по моему красиво каждой динамически создавать обработчик. Как думаете?

[DynkanMaclaud]

Frozen Coyote,

function makeHTML(el) {
  var mas=[];
  var i=0;
  for (;i < el.length; i++) {
  	$('body').append('<button onclick="start(elem, '+i+')">Моя кнопка</button>');
    mas.push(el[i]);
  };
  return mas;
};
function start(el,index) {
	alert(el[index].innerHTML);
};
var elem = makeHTML( $('div'));

[destus]

DynkanMaclaud,
Зачем DOM элемент в массиве хранить? А если со страницы удалить элемент? Я так понимаю, что утечка памяти - не единственное следствие. Обработчики остаются в памяти и продолжают работать.

<div>123</div>
<script src="https://code.jquery.com/jquery-2.2.4.min.js"   integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="   crossorigin="anonymous"></script>
<script>
function makeHTML(el) {
    var mas=[];
    var i=0;
    for (;i < el.length; i++) {
        $('body').append('<button onclick="start(elem, '+i+')">Моя кнопка</button>');
        mas.push(el[i]);
    };
    return mas;
};
function start(el,index) {
    alert(el[index].innerHTML);
};
var elem = makeHTML( $('div'));

$('div').remove(); //123

</script>

[DynkanMaclaud]

destus,

Подскажите плиз, как этот el внутри makeHTML передать в start?

Попросили передать el я и передал...

var elems = 'div';
function makeHTML(el) {
  var mas=[];
  var i=0;
  for (;i < el.length; i++) {
   $('body').append('<button onclick="start(elem, '+i+')">Моя кнопка</button>');
   mas.push(el[i]);
  };
  return mas;
};
function start(el,index) {
  (checkEl()) ? alert(el[index].innerHTML) : delete el[index];
  function checkEl() {
  	if (document.querySelectorAll(elems)[index]) return true
    else return false;
  };  
};
var elem = makeHTML( $(elems));
$('div').remove(); //

[destus]

DynkanMaclaud,
WeakMap еще можно использовать как вторичное хранилище. Без дополнительных танцев с бубном

[Rise]

можно ли оформить передачу не самого объекта DOM, а к примеру что то вроде ссылки на него?

Объекты всегда передаются по ссылке не переживай, ибо если есть хоть одна ссылка на него он существует.