Laravel eloquent join in ajax

Hi. How can i get laravel eloquent join in ajax success function ?

this is User Model

<?php

namespace App;

use Illuminate\Notifications\Notifiable;
use Illuminate\Foundation\Auth\User as Authenticatable;

class User extends Authenticatable
{
    use Notifiable;

    protected $fillable = [
        'first_name', 'last_name', 'email', 'country', 'type', 'password',
    ];

    protected $hidden = [
        'password', 'remember_token',
    ];

    function products(){
        return $this->hasMany("App\ProductModel" , "user_id");
    }
}

and this is my products model

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class ProductModel extends Model
{
    protected $table = 'products';
    protected $fillable = [
        'user_id','category','title','description','photo','price'
    ];
    public $timestamps = true;

    function author(){
        return $this->hasOne("App\User", "id", "user_id");
    }
}

this is controller function

public function getProduct(){
        $product= ProductModel::all();
        return response()->json($product);
    }

and this is my ajax function

$.get("{{route('get.product')}}", function(data){
     console.log(data)  // console array on obj
     $(data).each(function(index,element){
        console.log(element.author)     // console undefined
     })
});

on laravel blade its works grate but on ajax does not work