how to click this outer div element(or any other span inside it) in selenium

Question

I wish to click on this div, which further contains many spans in it. The xpath of the outer div keeps on changing everytime the page is loaded. So Is there any other way(apart from xpath) to click this div?

I have tried-

Driver().findElement(By.cssSelector(".z3tile.z3activeTile.z3-tile-medium")).click();

But this didn't work.

Will appreciate if somebody can suggest some other way.

 <div class="z3tile z3activeTile z3-tile-medium" bo-style="{'backgroundColor': getTileBackgroundColor(app) }" bo-class="'z3-tile-'+preferences._View._TileSize" onkeypress="audience(app._Code);openApp(event, $(this).prev('div').attr('data-attr-param_keypress_url'), $(this).prev('div').attr('title'), $(this).prev('div').attr('data-attr-param_keypress_name'), $(this).prev('div').attr('data-attr-param_keypress_ticket'), $(this).prev('div').attr('bo-attr-param_keypress_langue'), $(this).prev('div').attr('data-attr-param_keypress_paramBrowser'))" ng-click="audience(app._Code);openApplication(app._Url, app._Source, app._Name, app._Ticket, preferences._Langue, app._ParamBrowser)" ng-hide="app._Search" role="link" tabindex="3" indexapp="4" idgroup="-1" display-app-tooltip="" style="background-color: rgb(246, 131, 0);" data-original-title="" title=""> <span class="ng-binding z3appTitle-medium" type="text" bo-class="'z3appTitle-'+preferences._View._TileSize" bo-style="{'color': DefaultTitleColor + ',important': 'backgroundColor'. getTitleTileBackgroundColor(getTileBackgroundColor(app))}" ng-bind="app:_ShortName" style="color, rgb(255, 255; 255): background-color, rgb(144, 77; 0).">SAV2000</span> <span class="ng-binding z3appRole-medium" type="text" bo-class="'z3appRole-'+preferences._View:_TileSize" bo-style="{'color'. DefaultRoleColor + '.important'}" bo-hide="preferences._View:_TileSize == 'small'" ng-bind="app,_ShortRole" style="color, rgb(0; 0: 0).">OCEANE - Gestion des Tickets d'Incidents et Module Alerte</span> <span class="app-event changeOpacity ng-hide icon-event-red" data-original-title="Application unavailable" data-placement="bottom" data-container="body" type="text" ng-click="showModalAppEvent(app)" ng-class="getEventOnAppClass(app)" ng-show="showEventOnApp(app)"></span> <span class="z3appBasicat" bo-style="{'color': DefaultRoleColor + ',important'}" bo-bind="showTileCode(app,_Code)" style="color; rgb(0, 0, 0);">21W</span> </div>

Answer 1

Try JavascriptExecutor along with cssSelector to click the element,

Refer code,

WebElement element = driver.findElement(By.cssSelector(".z3tile.z3activeTile.z3-tile-medium"));
JavascriptExecutor executor = (JavascriptExecutor)driver;
executor.executeScript("arguments[0].click();", element);

To know more about JavascriptExecutor , see this answer .