Monthly Archives: September 2013

Dynamically wrap specific HTML elements with jQuery

Constructs of my HTML and selectors are pertinent to my project only. HTML is assumed to have an initial div block with an unordered list as its child written natively to the index file.


//Published unordered list
var pubList = $('div.entrysingle.hidden ul');

//Check if unordered list is visible
if (pubList.length > 0) {

    var boxItOptHdrs = $('div.entrysingle.hidden ul .selectboxit-optgroup-header');
    var split_at = boxItOptHdrs;
    
    $(split_at).each(function() {
      $(this).add($(this).nextUntil(split_at)).wrapAll('
'); }); }

Check html element for inline CSS


/**
 *	Check all div elements for inline CSS display block.
 *	Should output 'Do stuff.' if display block is true.
 *	Requires jQuery to leverage: $ alias and .css() method
 */
if (($('div').css('display') == 'block')) {
	console.log('Do stuff.');
}

/**
 *	Select div element(s) with inline CSS display block.
 *	Should return div element(s) if executed in dev console.
 *	Requires jQuery to leverage: $ alias
 */
$('div[style="display: block;"]'); 

Thanks to: Stackoverflow and jsfiddle