How to check a form value with jQuery, if you use $(this)?

There is the following code:
HTML:

Write about your question :)

JS ( jQuery ):

$('input').on('input', function() { if ( $(this).attr('name') === 'name' ) { if ( $(this).val().length <= 2) { $('.name-spoiler').text('Your name must contain at least 3 letters!').css('color', 'red'); } else { $('.name-spoiler').text('Your name is correct!').css('color', 'green'); } } if ( $(this).attr('name') === 'email' ) { if ( !$(this + ':contains("@")') ) { $('.email-spoiler').text('Your email must contain "@" character!').css('color', 'red'); } else { $('.email-spoiler').text('Your email is correct!').css('color', 'green'); } } });

The catch is that you have to use :contains() in conjunction with $(this), jQuery considers it as trouble, ie it is contrary to its structure. What about indexOf(): it does not work with jQuery functions like $(this).text (), etc. How to check $(this).text() or $(this) on the content of the symbol, for example "@" for email validation? Can and regular expressions, but more appropriate jQuery methods. In advance thank you from the heart :)))