Get Selector of found elment : Short question,

I'm iteration through a list of li's to get the li which is in the center of the screen (on scroll) with this function:


    var findMiddleElement = (function(docElm){
    var viewportHeight = docElm.clientHeight,
    elements = $('li');
    
    return function(e){
    var middleElement;
    if( e && e.type == 'resize' )
    viewportHeight = docElm.clientHeight;
    
    elements.each(function(){
    var pos = this.getBoundingClientRect().top;
    // if an element is more or less in the middle of the viewport
    if( pos > viewportHeight/2.5 && pos < viewportHeight/1.5 ){
    middleElement = this;
    return false; // stop iteration 
    }
    });
    
    console.log(middleElement);
    
    }
    })(document.documentElement);


This works great so far. The Problem is that 'middleElement' will return something like this:

    <li style="padding-top: 12.8438px; padding-bottom: 12.8438px;">Menu Item 8</li>

I need to add a CSS style to it. Since 

    middleElement.css

doesn't work, I need a way to get the selector of the found element. Any Ideas?

Thank you very much!
