Extending the RaxanElement Class

PHP/HTML Source: 
<?php

require_once "raxan/pdi/autostart.php";

class MyPage extends RaxanWebPage {

    function _init() {
        $this->source('views/custom-methods.html');

        // call custom zerba function
        $this->table1->zebra('softyellow','white');
            
    }
   
}

// add custom methods to RaxanElement
RaxanElement::addMethod('zebra', 'zebra_tables_extension');

// Zebra Table Custom Method
function zebra_tables_extension($elm,$args){
    $t1 = isset($args[0]) ? $args[0] : '';
    $t2 = isset($args[1]) ? $args[1] : '';
    if ($t2) $elm->find('tr:odd')->addClass($t2)->end();
    return $elm->find('tr:even')->addClass($t1)->end();
}

?>
Plugin Source:
HTML/JavaScript Source (views/custom-methods.html): 
<!DOCTYPE html>

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title>Zebra Stripes</title>
    <link href="../raxan/ui/css/master.css" rel="stylesheet" type="text/css" />
    <!--[if lt IE 8]><link rel="stylesheet" href="../raxan/ui/css/master.ie.css" type="text/css"><![endif]-->
    <link href="../raxan/ui/css/default/theme.css" rel="stylesheet" type="text/css" />
</head>

<body>
    <div class="container c35 prepend-top">
        <div class="rax-backdrop">
            <div class="pad white round">
                <h3 class="bmm">Zebra Custom Method</h3>
                <p class="lightgray pad round">These zebra stripes where created using the custom zebra() method:</p>
                <table id="table1" class="rax-table border">
                    <thead><tr class="tbl-header"><th>Fruits</th><th>Sales (%) in Q3</th></tr></thead>
                    <tbody>
                        <tr><td>Apple</td><td>40</td></tr>
                        <tr><td>Mangoes</td><td>20</td></tr>
                        <tr><td>Pears</td><td>10</td></tr>
                        <tr><td>Grapes</td><td>30</td></tr>
                        <tr><td>Banana</td><td>25</td></tr>
                        <tr><td>Oranges</td><td>45</td></tr>
                        <tr><td>Strawberries</td><td>6</td></tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</body>

</html>
Data Source: