How can I change the dropdown of 'show entries' and 'search bar'?

Hello, so this question is very similar to the one I made last year but unfortunately I still have the issue: https://www.datatables.net/forums/discussion/48759/how-can-i-access-edit-the-show-entry-dropdown-select#latest

So I'm using MDB4 Pro framework with datatable and I'm trying to change the drop-down of the 'show entries' by using the material select: https://mdbootstrap.com/docs/jquery/forms/select/. Last time someone said to use this code:

                initComplete: function () {
                    $('select[name="dtBasicExample_length"]').addClass('mdb-select');
                    $('.mdb-select').material_select();
                },

But it is not working.

I'm also trying to do the same thing with the search bar by changing it to the material input: https://mdbootstrap.com/docs/jquery/forms/inputs/ .

Any idea on how to change both the dropdown of show entries and the search bar of search to work with the material design ones? PS: I know they have a datatables plugin but is filled with errors so can't use that.

Thanks in advance.