<div class="b-product">
	<div class="b-product__name">Coffe</div>
	<div class="b-product__price">$2</div>
</div>
<div class="b-product">
	<div class="b-product__name">Tea</div>
	<div class="b-product__price">$1</div>
</div>

$('.b-product:first').elem('name');              // $('.b-product:first > .b-product__name')
$('.b-product:first').elem('name').up();         // $('.b-product:first > .b-product__name').closest('.b-product')
$('.b-product:first').elem('name').up('price');  // $('.b-product:first > .b-product__name').siblings('.b-product__price')

<div class="b-product">...</div>

$('.b-product').setMod('theme', 'premium');  // will get .b-product.b-product_theme_premium
$('.b-product').setMod('premium');           // will get .b-product.b-product_premium_yes

<div class="b-product b-product_theme_premium">...</div>

$('.b-product').delMod('theme', 'premium');  // $('.b-product').removeClass('.b-product_theme_premium');
$('.b-product').delMod('theme');             // remove the modifier "theme" of any value (.b-product_theme_*)

<div class="b-product b-product_theme_premium">...</div>

$('.b-product').getMod('theme')      // will return "premium"
$('.b-product').getMod('discount');  // will rerurn null (non-existent modifier)

<div class="b-product b-product_theme_premium">...</div>

$('.b-product').hasMod('theme');             // true
$('.b-product').hasMod('theme', 'premium');  // true
$('.b-product').hasMod('theme', 'discount')  // false

<div class="b-product b-product_theme_premium">...</div>
<div class="b-product">...</div>

$('.b-product').byMod('theme', 'premium');     // instead of $('.b-product.b-product_theme_premium')
$('.b-product').byNotMod('theme', 'premium');  // instead of $('.b-product').not('.b-product_theme_premium')
$('.b-product').byMod('theme');                // filtering by modifier "theme" of any value (.b-product_theme_*)

bem.decl('b-product', {
		onInit: function($this) {
				// Add to element "price" modifier "size" with a value of "large" when DOM ready.
				$this.elem('price').setMod('size', 'large');
		},
		title: {
				onMouseover: function($this) {
						// Add to root block "b-product" modifier "state" with a value "hover"
						$this.up().setMod('state', 'hover');

						// Call the helper function.
						this._customFunction();
				},
				_customFunction: function() {
						console.log('I am helper function');
				}
		},
		price: {
				onSetmod: function($this, e, modKey, modVal) {
						// Print to console information about the installed modifier of element "price".
						console.log('Modifier set:', modKey, modVal);
				},
				onDelmod($this, e, modKey, modVal) {
						//
				}
		}
});

bem.setConfig({
	namePrefix: '',     // Names prefix (RegExp)
	elemPrefix: '-',    // Element prefix
	modPrefix: '_',     // Modifier prefix
	modDlmtr: '-'       // Delimiter for the modifier key and value
});

.block
.block-element
.block-element_modifier-value