Javascript: null is not an object (evaluating 'document.id(options.update).empty')

I have some javascript framework collisions.

I usually used the following function in Rails Apps:

// ArticleRequest funtion
function ArticleRequest (article_url, article_target) {
    var req = new Request.HTML({
        method: 'get',
        url: article_url,
        update: $(article_target),
    });
    req.send();
    };

This required MooTools-Core-1.2.1 and MooTools-More but I could do this:

<a onClick="ArticleRequest('/cases/show/<%= work.id %>', 'work<%= work.id %>');">

I had the function once and would define url and target options each time.

Unfortunately the use of both frameworks produce:

TypeError: undefined is not a function (near '...$(document).on...')

for a jQuery part related to an AJAX call, which I need for a newer app:

// Load selector on change
$(document).on("change", "#lands_select", function(event){
  $.ajax({
    url: "/carts/update_shipping/" + event.target.value,
    type: "GET"
  })
});

When I try to use a newer version of MooTools such as 1.6.0 the dynamic select works but the article request produces:

TypeError: null is not an object (evaluating 'document.id(options.update).empty')

- success - MooTools-Core-1.6.0.js:6026
- (anonymous function) - MooTools-Core-1.6.0.js:1106
- onStateChenge - MooTools-Core-1.6.0.js:5768
- (anonymous function) - MooTools-Core-1.6.0.js:1106
- (anonymous function)

Is there a way to have both functions working? Maybe by having them in vanilla Javascript?

Thanks in advance!