How can I remove a specific css element from a specific page with jquery?

This is a fairly straightforward use of jQuery. First, you look up elements with that class using a class selector, then you use first to ignore all of them except the first one, then you do something with that element.

What you actually want to do is a bit unclear from the question, but there are two likely options:

If you want to actually remove the element, use remove:

$(".ms-webpart-chrome").first().remove();

If you just want to remove that class from it, use removeClass:

$(".ms-webpart-chrome").first().removeClass("ms-webpart-chrome");

Using .first() is the most efficient option in my experience, but it's unlikely to matter. The first bit (looking it up by class and getting just the first one) can also be done using the :first selector (or :eq(0)):

$(".ms-webpart-chrome:first").doSomething();

In both cases, that may force jQuery to use its own selector engine rather than built-in browser features, which may not be ideal. But if you're only doing this once, it would only matter on a truly massive page.

If each page has a class .pages you can use each to loop through each page and remove the first element with the class ms-webpart-chrome

$('.pages').each(function(){
$(this).find('.ms-webpart-chrome:first').remove();
});

By using jQuery :

$(function(){
$('.ms-webpart-chrome').each(function(){
$(this).removeClass('ms-webpart-chrome');
})
})

By using CSS :

Find the CSS file and search for '.ms-webpart-chrome' and delete the whole line.