WordPress - remove action defined within plugin class

Question

So I have this plugin code

class WC_List_Grid {

 public function __construct() {
   add_action( 'wp' , array( $this, 'setup_gridlist' ) , 20);
 }

 function setup_gridlist() {
  add_action( 'woocommerce_before_shop_loop', array( $this, 'gridlist_toggle_button' ), 30);
 }

 function gridlist_toggle_button() {?>
                <nav class="gridlist-toggle">
                    <a href="#" id="grid" title="<?php _e('Grid view', 'woocommerce-grid-list-toggle'); ?>"><span class="dashicons dashicons-grid-view"></span> <em><?php _e( 'Grid view', 'woocommerce-grid-list-toggle' ); ?></em></a>
                    <a href="#" id="list" title="<?php _e('List view', 'woocommerce-grid-list-toggle'); ?>"><span class="dashicons dashicons-exerpt-view"></span> <em><?php _e( 'List view', 'woocommerce-grid-list-toggle' ); ?></em></a>
                </nav>
 <?php }
}

I want to change the content of the gridlist_toggle_button function. This is how I am planning to change the content of that function. Like writing another function with almost the same html as the original one but bits of my changes. Something like

add_action('woocommerce_before_shop_loop','new_gridlist_toggle_button')
function new_gridlist_toggle_button() {?>
                <nav class="gridlist-toggle">
                    <a href="#" class="grid-view" title="<?php _e('Grid view', 'woocommerce-grid-list-toggle'); ?>"><span class="dashicons dashicons-grid-view"></span> <em><?php _e( 'Grid view', 'woocommerce-grid-list-toggle' ); ?></em></a>
                    <a href="#" class="list-view" title="<?php _e('List view', 'woocommerce-grid-list-toggle'); ?>"><span class="dashicons dashicons-exerpt-view"></span> <em><?php _e( 'List view', 'woocommerce-grid-list-toggle' ); ?></em></a>
                </nav>
 <?php }
}

That way, I won't have to change the plugin files directly

For that, I am trying to remove its related action.

add_action( 'woocommerce_before_shop_loop', array( $this, 'gridlist_toggle_button' ), 30);

So that I may use my own code. But I can't seem to remove this action. I have tried this so far.

Method 1:

global $WC_List_Grid    ;
remove_action( 'woocommerce_before_shop_loop', array( $WC_List_Grid, 'gridlist_toggle_button' ), 100);  

Method 2:

function remove_plugin_actions(){
 global $WC_List_Grid   ;
 remove_action( 'woocommerce_before_shop_loop', array( $WC_List_Grid, 'gridlist_toggle_button' ), 100); 
}
add_action('init','remove_plugin_actions');

Method 3

remove_action( 'woocommerce_before_shop_loop', array( 'WC_List_Grid', 'gridlist_toggle_button' ), 100); 

None of them seems to work.

With a bit of brainstorming, I think there could be two possible causes.

1. Its not working because the action I want to remove is not directly attached to the hook. Its action inside action.
2. I am trying to block the output of gridlist_toggle_button via functions.php. But if the plugins load before functions.php then the function to be blocked away is already being called and hence it is always showing output.

I am no good with OOP at all. Can someone please help me out?